Menu
I want to put padding on a css border. Pull it inside a div, away from the edge. Is this possible using css (css3 is fine, webkit).
Here is the design.
I did this by placing a div inside a div, then give a border to the inner div. I want to make the markup slim as posible so I want to use only one div if posible.
Thank you.
923
No, that's not possible. Padding, margin and border are all parts of elements, you can't give a border padding or a margin a border.
In CSS, a margin is the space around an element's border, while padding is the space between an element's border and the element's content. Put another way, the margin property controls the space outside an element, and the padding property controls the space inside an element.
Padding: is the lower edge of the CSS box, namely the outer edge of the content box and the edge of the edge of the border; the transparency is transparent. Content: is the content of the CSS box, where both the images and the text are inserted.
Adjusting the Margin Size of an HTML Element With CSS You can remove this margin by setting the top and left margin to zero. Like the padding and border, the sizes of specific sides of the margin can be set using margin-left , margin-right , margin-top , and margin-bottom .
You should be able to do this with the CSS outline property:
<style> .outer { outline: 2px solid #CCC; border: 1px solid #999; background-color: #999; } </style> <div class="outer"> example </div> Instead of borders, you may use outline property:
div{ height:300px; width:500px; background-color:lightblue; outline:dashed; outline-offset:-10px; }<div></div>http://jsfiddle.net/H7KdA/
44
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
