View Full Version : CSS Float Issue
09-20-2005, 12:11 AM
The problem I'm having is that an entire div is not showing up on a page that I am working on. It is basically a 'footer' div (underneath everything) that has some simple text and a link.
You will have to view the source to see the CSS I'm talking about. It is the '#pdm' id that I'm referring to. If I remove the 'float left' from the above div '#pictures' it will then show up and allow me to use the top margin I would like, but this screws up the picture placement. Thanks for taking the time to read this, and thanks for any input you may have, theMind-
PS How do I delete threads that I have posted? If/when I find my own solutions (such as the hover box thread) I would like to be able to delete the thread so as not to waste anybody's time, or forum space. Thanks, tM
09-20-2005, 09:33 AM
Remove "position:relative;" from the #pdm
09-20-2005, 01:21 PM
The problem I'm having is that an entire div is not showing up on a page that I am working on. It is basically a 'footer' div (underneath everything) that has some simple text and a link.It is showing up in Firefox. Notice the horizontal scrollbar? Press Ctrl+A to select all text on the page, then scroll to the right and you'll see your text level with the products image.
The reason is that when content is floated, in-flow content moves next to that content. To ensure that later content appears below the floated content, use the clear property.
Incidentally, you can simplify that quite a bit. You certainly don't need any tables or that many div elements. Take a look at a quick mock-up (http://mwinter.webhop.info/dd/themind/smoke-ring/) I've produced. Obviously Firefox and Opera will show it the best, but the result is fine in IE, too. It could be improved a bit by emulating the max-width property, but that's overkill I think.
This example is usable when images are disabled, not least because background images are supplimented by background colours (unlike in the original).
Remove "position:relative;" from the #pdmThat might work for IE (due to its broken behaviour), but it's not an actual fix. On the subject of the position property, I believe all instances of it can be removed. With the #container element (the only rule where the position property actually does anything), it should be replaced with the appropriate margins on that element.
Powered by vBulletin® Version 4.2.2 Copyright © 2016 vBulletin Solutions, Inc. All rights reserved.