Menu
Does margin:5px 0; mean margin:5px 0 0 0; or margin:5px 0 5px 0;?
Does margin:5px 0 0; mean margin:5px 0 0 0;?
Same for padding of course.
Also, is it consistent across all browsers (including IE6)?
474
margin: 10px 5px 15px 20px; top margin is 10px. right margin is 5px. bottom margin is 15px. left margin is 20px.
For zero padding, imagine putting a box into a box where the inner box is just slightly smaller so it fits perfectly. There is no space between the inner (content) box and the outer (border) box so there is zero padding. Margin is just the space outside the border.
0 is for top-bottom and auto for left-right. It means that left and right margin will take auto margin according to the width of the element and the width of the container. Generally if you want to put any element at center position then margin:auto works perfectly.
Margins are used to create space around elements, outside of any defined borders. This element has a margin of 70px.
According to Box Model:
- If there is only one value, it applies to all sides.
- If there are two values, the top and bottom margins are set to the first value and the right and left margins are set to the second.
- If there are three values, the top is set to the first value, the left and right are set to the second, and the bottom is set to the third.
- If there are four values, they apply to the top, right, bottom, and left, respectively.
body { margin: 2em } /* all margins set to 2em */ body { margin: 1em 2em } /* top & bottom = 1em, right & left = 2em */ body { margin: 1em 2em 3em } /* top=1em, right=2em, bottom=3em, left=2em */ This is defined by the CSS standard, so it should be consistent across all browsers that implements CSS correctly. For browser compatibilities, check out blooberry's CSS Support History and quirksmode. According to blooberry, margin was first implemented in IE3, so IE6 should be fine.
61
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
