html - use width inside of calc -
i trying this:
.my-style { width: 50px; margin-left: calc(50% - calc(width / 2)); }
later changing width 90px , want margin grow accordingly.
doesn't work. possible?
the newest browser's should support it, tried following code.
this webkit example made, check in chrome
css
p { -webkit-var-a: -webkit-calc(1px + 3px); margin-left:-webkit-calc(-webkit-var(a) + 5px); }
html
<p>this text should have margin-left, doesn't</p>
fiddle
if inspect <p>
element can see see code valid, doesn't anything... seems have use javascript, less or equivelent it's still experimental feature.
edit:
it does seem work when make var plain number:
p { -webkit-var-a: 3px; margin-left:-webkit-calc(-webkit-var(a) + 5px); }
so answer question, yes possible, not recommend now.
css
.my-style { height:100px; background-color:black; -webkit-var-width: 50px; margin-left: -webkit-calc(50% - -webkit-var(width) / 2); }
fiddle
Comments
Post a Comment