Is it possible to increase the distance between a border and its content? If it is possible, just do it on here: JSFiddle
What I plan on doing is putting a glow around the content (using a shadow with 0px/0px distance) and then putting a border a couple of pixels away from the glow.
NOTE: I have decided to do an inset shadow and a border instead, it looks better, but thanks for the answers :3
You usually use padding to add distance between a border and a content. However, background are spread on padding. You can still do it with nested element.
The Architecture: The content is surrounded by the border, the space between the content and the border is called the padding, while the space between the border and the other elements in the document is called the margin.
Padding is used to create space around an element's content, inside of any defined borders.
Add padding. Padding the element will increase the space between its content and its border. However, note that a box-shadow will begin outside the border, not the content, meaning you can't put space between the shadow and the box. Alternatively you could use :before or :after pseudo selectors on the element to create a slightly bigger box that you place the shadow on, like so: http://jsbin.com/aqemew/edit#source
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