On 18 Jul 14:35, Chris G wrote:
On Mon, Jul 18, 2011 at 01:34:31PM +0100, Robert Waldie wrote:
On 18/07/11 12:39 PM, Chris G wrote:
It's the last bit that's difficult as the paragraph by default has a space under it. It's not easy to add a class/id to the paragraph and anyway that seems to be a rather inelegant solution. What I want is a way to say that I *never* want a big margin when there's a UL under a P.
Hi Chris,
Your example rendered in unstyled HTML looks "correct" to my eye, despite the whitespace between the heading/paragraph and list. I wouldn't diverge too far from that layout unless there's a compelling reason.
Yes, my example looks OK but I can't reproduce it in reality using HTML.
If you want to more obviously delineate sections I suggest containing each in a <div>, using a styled <hr> at the end of each, and/or increasing the left margin of <p>.
Of course there are other hacks like setting a negative top margin on <ul> or using Javascript to traverse the DOM.. :o
I've been there! :-)
However the difficulty is that I have no easy way to give the <ul> under a paragraph a different margin from a <ul> under a heading - this is the fundamental problem.
Well, CSS2 would let you...
h1 + ul { margin-top: 0em; }
and
p + ul { margin-top: 1.5em; }
See: http://www.w3.org/TR/CSS2/selector.html
And look at: http://www.w3.org/TR/CSS2/selector.html#adjacent-selectors
in particular.
HTH, HAND.