On Tuesday, January 26, 2010 10:34:18 pm Rick wrote:
> Why doesn't the division extend to the bottom of the
> images?
>
The images are floated, which means that they are "out of the flow."
Basically that means that they don't take up any space in their parent
container. As a result, the link goes over the the image, and the div is too
short.
There are several solutions to this problem, depending on the situation.
Putting a height on your div (as you mentioned) is one, or setting the div
have overflow: hidden, will make the div extend to the bottom of the pictures,
but then the link will still go over the image, so those solutions aren't
appropriate in this situation. What *will* accomplish what you're aiming for
is another clear.
#banner a {
display: block; / *add */
clear:left; /* add */
margin-left: -110px; /* delete */
margin-top:200px; /* delete */
}
The display: block is necessary to make clear work on <a>. And then clear
left makes it go below the floated image. Then you can get rid of your
margins, because clear is doing all the work for you.
---Tim
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
