aligning div's within a div header — OZONE Asylum, home of the Mad Scientists

XML - XSL - XSLT - XHTML - CSS - DOM

aligning div's within a div header

This page's ID: 11106

Edit Post

Who can edit a post?	The poster and administrators may edit a post. The poster can only edit it for a short while after the initial post.

Your User Name:
Your Password:
Login Options:	Remember Me On This Computer

Your Text: Insert Slimies » Insert UBB Code » Close Last Tag \| All Tags UBB Help	Here's the CSS2 specs on [url=http://www.w3.org/TR/REC-CSS2/visuren.html#inline-formatting]inline formatting[/url]. Now if you can tell me exactly what all of that means, you win the prize. I understand it in principle, but those specs are confusing. Anyway, I've never tried to use inline formatting in the way you're suggesting, but I think I know why it doesn't work. Setting a div to inline means that the elements within that div will display in an inline format, [b]not[/b] that the div itself will display inline. In other words, if you want the two divs within the header to display in an inline format, you would need to set the header div itself to inline. That being said, I think your best bet here is using float, as suggested above. Although I can't tell for certain without seeing the page, I'm pretty sure that the reason you are getting the overlap is because the floated element is not as tall as the non-floated element--the image on the left is only 71px tall, yet you've got a bunch of text on the right (not floated) that is longer. Your browser is calculating the vertical position of the following divs based on where the floated element ends, thus the overlap. I experienced this same problem on my site, and due to the way I have things set up (sometimes the text on the right is longer than the float, sometimes it isn't), I had no choice but to create a dummy div set to "clear" to go right after the float and the text. You, however, shouldn't have to resort to that, since the image and text are not going to be changing in size (right?). If that is the case, you should be able to just float the (longer) right-hand element instead of the left-hand element, and the browser should calculate the vertical position of the following divs based on that. Hope that helps. ___________________________ Suho: [url=http://www.liminality.org]www.liminality.org[/url] Loading...
Options:	Enable Slimies Enable Linkwords

« Backwards — Onwards »

Show Forum Drop Down Menu