Padraic Posted September 21, 2009 Share Posted September 21, 2009 Hi, i am trying to have two nearly page lenght columns on my site, the narrow left column has the links near the top but i want the column to continue with the same colour down to the bottom of all my site's pages no matter how much page content is in the wider right hand column. I could use a two cell one row table but i want to avoid tables as much as possible. I have the page set up aprt from this problem. I had used a thin background image to do the the trick but that will make it more difficult to change the colours on the page which kind of defeats the point of learning and using CSS! Link to comment Share on other sites More sharing options...
jlhaslip Posted September 21, 2009 Share Posted September 21, 2009 google faux columns Link to comment Share on other sites More sharing options...
dsonesuk Posted September 22, 2009 Share Posted September 22, 2009 you could try using an absolute positioned div to required width to 2000px height, within a relative positioned, overflow: hidden containing div, which will basically take the place of background image. Then all you have to do change the background colour of this div to required.#wrapper{overflow:hidden;position:relative; }#right_bg{height: 2000px; width:127px; background-color:#000; position:absolute; right: 0; top: 0px;} Link to comment Share on other sites More sharing options...
dsonesuk Posted September 22, 2009 Share Posted September 22, 2009 i don't know what sort of layout you have, but have you tried this:<body><div style="width:100%; background-color:#000000; float:left; color:#CCCCCC;"><div style="width:148px; float:left; padding:5px;"><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p></div><div style=" background-color:#CCCCCC;color:#000000;padding:10px; margin-left: 155px; min-height: 600px;"><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex.</p> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex.</p> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex.</p> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex.</p> </div></div></body>Edit: if you want fluid.....Tada now fluid Link to comment Share on other sites More sharing options...
Synook Posted September 22, 2009 Share Posted September 22, 2009 http://www.aspektas.com/blog/two-column-eq...t-fluid-layout/ Link to comment Share on other sites More sharing options...
dsonesuk Posted September 23, 2009 Share Posted September 23, 2009 well, if you wanted fluid? No Problemo, see my previous edited post. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.