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

http://jsfiddle.net/uqe8b/

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); } 

http://jsfiddle.net/uqe8b/1/

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

http://jsfiddle.net/shsmx/


Comments

Popular posts from this blog

How to mention the localhost in android -

php - Calling a template part from a post -

c# - String.format() DateTime With Arabic culture -