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

Popular posts from this blog

how to proxy from https to http with lighttpd -

android - Automated my builds -

python - Flask migration error -