Home | Contact Us | FAQ | Search & Site Map | Link to Us
Sign In | Join | Other 45 Sites in Network
Home
Discussion GroupsGeneralPHPASPPerlColdFusionFlashHTML, CSS, ScriptsBrowsers

Webmaster Forum / HTML, CSS, Scripts / CSS / October 2005



Tip: Looking for answers? Try searching our database.

Background image doesn't fill a float:left column

Thread view: 
Enable EMail Alerts  Start New Thread
Thread rating: 
RJ - 31 Oct 2005 20:37 GMT
Hello!   I am trying to lay out a left navigation column with a
background image, where the left nav column runs the entire scrolled
height/length of the page.  The float:left column layout works fine, but
the background image doesn't continue downward in this column below the
links.  I tried this in FireFox 1.0.7 and IE6, but this image stops
where the last link stops.  I want the background all the way to the bottom.

How can I force the background image to repeat all the way down the left
column even if there are no links or text displayed in this area?
Thanks in advance for any input on this issue.

RJ

My css ---->

#left-navigation-column {
 float:left;
 background-image:url("background.gif");
 background-repeat: repeat-y;
 width:150px;
 }
Els - 31 Oct 2005 20:39 GMT
> Hello!   I am trying to lay out a left navigation column with a
> background image, where the left nav column runs the entire scrolled
> height/length of the page.  The float:left column layout works fine, but
> the background image doesn't continue downward in this column below the
> links.  I tried this in FireFox 1.0.7 and IE6, but this image stops
> where the last link stops.

That's because that's how high that floated div is. It will only
extend to the height of its content. (set a border to see it)

> I want the background all the way to the bottom.
>
> How can I force the background image to repeat all the way down the left
> column even if there are no links or text displayed in this area?

By faking it.
Set the background (an image of the same width as the column) to the
container that holds the floated div and the content area. Make sure
you have the background of the floated div set to transparent.

> Thanks in advance for any input on this issue.

You're welcome :-)

Signature

Els                     http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
                            - Renato Russo -

 
Sign In
Join
My Latest Posts
My Monitored Threads
My Blog
My Photo Gallery
My Profile
My Homepage

Start New Thread
Enable EMail Alerts
Rate this Thread



©2009 Advenet LLC   Privacy Policy - Terms of Use
This website includes both content owned or controlled by Advenet as well as content owned or controlled by third parties.