CSS controlling block element spacing
I have a <div>
that is filled with varying block elements (e.g. <p>
, <ul>
, <ol>
, <blockquote>
, etc.). I'm looking to control only the spacing between those child block elements. I also want there to be no spacing between the child block elements and the top and bottom of the parent div.
I've played with a few solutions. The main one being a mess of a r开发者_开发技巧ule using the adjacent sibling combinator. The other being setting the margin-top
value to the desired spacing and then using the :first-child
pseudo selector.
Are there any cleaner solutions with a decent amount of compatibility?
Thanks.
Personally I would make selectors for all child element types separately because CSS3 pseudoclasses are not implemented well in all browsers for now. You can do it this way in the cleanest manner I can think about:
div.class blockquote, div.class p, div.class ul { /* something */ }
etc.
If i got your point right, shouldn't this suffice?
div * { margin:0 10px }
That * is a bad selector though performance-wise, because of how browsers work: http://www.stevesouders.com/blog/2009/06/18/simplifying-css-selectors/
精彩评论