css problem with positioning and background

[barcin25]

Hi,

I have one problem with posotionig.
I have HTML code:

<div id="main">
<div id="content"> bla bla vla
</div>
<div id="side_bar">
</div>
</div>

and CSS code:
#main
{
width:750px;
height:auto;
margin:0;
padding:0;
text-align:left;
position:relative;
background-image:url(/images/main_bg.jpg);
background-repeat:repeat-y;
}
#content{
width:550px;
height:auto;
padding:0;
margin:0;
position:absolute;
top:0px;
left:0px;
background-color:transparent;
}
#side_bar{
position:absolute;
height:auto;
top:0px;
left:550px;
width:200px;
padding:0;
margin:0;
background-color:transparent;
}

The problem is that I can't see /images/main_bg.jpg from the "main" DIV. I don't know why, I've tried so many solutions and no success.

Please hlp me,

Bes regards,

barcin

[simonuk]

A shorter code route would be:

#container {
width: 750px;
background-image: url(/images/main_bg.jpg);
background-repeat: repeat-y;
}
#left {
float: left;
width: 550px;
}
#right {
float: left;
width: 200px;
}

Then:

<div id="container">
<div id="left">Left stuff here </div>
<div id="right">Right stuff Here</div>
</div>

[HelenDev]

Is the path to the image correct?

Try stuffing a load of text or something into your main div, if there's no height specified on the div and not much content it might not be expanded enough for you to see any of your image.

[barcin25]

Thanks for replay,

Tha path is correct. I know that there's a problem with bg inheritance when elements're positionned. The content was few text-lines high. I gave up and used css creator from csscreator.com. I have no time for fighting with such problems ;)

So anyway, thanks for help.

Best regards,

barcin