Why would adding display:inline anywhere be ignored in this example? http://www.w3.org/TR/CSS21/box.html#mpb-examples
russ - maxdesign wrote:
Hi Scott, An inline element can have margin and padding applied to it but only left and right margin/padding will affect other elements. Top and bottom margin and padding will be ignored.
"Margin properties specify the width of the margin area of a box. The 'margin' shorthand property sets the margin for all four sides while the other margin properties only set their respective side. These properties apply to all elements, but vertical margins will not have any effect on non-replaced inline elements." http://www.w3.org/TR/CSS21/box.html#mpb-examples
You can see this in action in this over-the-top test: http://www.maxdesign.com.au/jobs/css/inline-test.htm
Browsercam results: http://www.browsercam.com/public.aspx?proj_id=143113'
The bold element has 40px of both margin and padding applied to it. You can see that the horizontal margin and padding are applied, as they affect other elements. However, the vertical effects of padding and margin have no effect on the div or the content within the div (the anonymous inline boxes) - they are ignored.
HTH Russ
Hmmmm - I'm having trouble dealing with one of those CSS concepts that I considered as easy as breathing...
I've got a block-level element (a div) that contains an inline element (a strong tag, but span would work the same...). When I apply padding to the internal element, it oversteps the boundaries of its parent element by the amount of the padding.
I thought the rule was that a container should expand to hold its contents (excepting floated elements...)
Apparently, I've been wrong all along. Can anyone kick me in the right direction?
****************************************************** The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help ******************************************************
****************************************************** The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help ******************************************************
