Quote:
Originally Posted by Nicolas F
You should have posted the capture directly, it would have ben easier to understand what you want to do.
The line goes at the top because you're using float. Your text is "floating" on the left or the right but it's not taken in consideration for the placement of the border. You need to add another <p> element at the end with clear:both,
for exemple:
Code:
<div style="font-size:x-small;"><p style="float:left;">_TITLE_</p><p style="float:right;"><i>_SECTION_</i></p><p style="clear:both;" /></div><hr />
or
Code:
<div style="font-size:x-small;border-bottom: 2px solid black;"><p style="float:left;">_TITLE_</p><p style="float:right;"><i>_SECTION_</i></p><p style="clear:both;" /></div>
|
Thanks.
Though still not quite right. I didn't get any line at all.
So on a hunch I increased the header height (I had it set at 40 as you can see above). and after that the line appeared. So it seems that the line is overlapped by the content. (Which means some of my attempts might have been successful also)
It's also too far below the header text to be aesthetic.
Is this supposed to happen? It feels like a bug to me, I'd expect the div to not be able to extend below the content.
Never mind. I figured out a way to fix this. (See below.)