css - Inner Border With Different Values Each -
how can made inner border different values each? example:
top: 20px
right: 80px
bottom: 40px
left: 10px
example want made...
thank you. :)
to make inner border, use 2 box-shadows on element, separated comma, , use negative values on second set. this:
box-shadow: inset 10px 20px 0px #000, inset -80px -40px 0px #000;
here jsfiddle demo: http://jsfiddle.net/dr_lucas/23egu/326/
this cross-browser compatible css:
-webkit-box-shadow:inset 10px 20px 0px #000, inset -80px -40px 0px #000; -moz-box-shadow:inset 10px 20px 0px #000, inset -80px -40px 0px #000; box-shadow:inset 10px 20px 0px #000, inset -80px -40px 0px #000;
note if need compatible old ie versions don't support box-shadow, can use css3pie: http://css3pie.com/
hope helps.
Comments
Post a Comment