3 column (actually, 5) layout problems...

ok... I got this code off of [webreference.com...]
I am implementing it on my site, which has a background image that is 4x4px that tiles to make a 'scanline' effect of sorts.
Problem is, since this layout (first layout I've seen that lets div's at least look like they're not touching) uses divs to separate the left, center and right columns, the separator divs background colors are solid. I tried to set background-image:"/images/page_bg.jpg"; on the separator divs to give it the illusion of an actual gap... but the div disappears totally!
I'm running IE6... here's the code I'm using:

body {
margin:0 0 0 0;
padding:0;
background-image:"/images/page_bg.jpg";}
#leftcolumn {
background:#0033CC;}
#leftspace {
margin-left:143px;
padding-left:9px;
background:#FFF;}
#rightcolumn {
background:#0033CC;}
#rightspace {
margin-right:143px;
padding-right:9px;
background:#FFF;}
#main {
background:#CCC;}
in the css file.

in the html I've got:

<html>
<head>
<title>.:-www.dispect.net-:.</title>
<link href="defstyle.css" rel="stylesheet" type="text/css">
</head>
<body background="images/page-bg.jpg">

<div id="leftcolumn">
<div id="leftspace">
<div id="rightcolumn">
<div id="rightspace" style="background-image:images/page_bg.jpg">
<div id="main">
The code you are reading.
</div>
</div>
</div>
</div>
</div>
so it's 5 divs nested within each other... but the "leftspace" and "rightspace" divs disappear when I try to assign a picture bg to them... any idea why? I tried making the width a multiple of 4, just to see if maybe it wasn't working because the image would get cut off or something, but nope.. I dunno what's wrong

someone help!

3 column (actually, 5) layout problems...

wrekon

Birdman

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week