Click to See Complete Forum and Search --> : help me with background-image for nested divs


ludacruzz
05-14-2009, 03:50 AM
I made a parent div and put inside the children ones , and I gave those children the background images using css,
the problem is that I don't neither see the children divs nor their backgrounds.

anyhelp!

thank you!

themarty
05-14-2009, 05:38 AM
without code or an online example, no one will be able to help you

ludacruzz
05-14-2009, 09:30 AM
here is what I've done before,

<div id="header">
<div id="logoposition"></div>
<div id="banposition"></div>
<div id="menu"></div>
</div>

and these are the CSS

#header{
border:groove 1px;
width: 1000px;
height: 229px;
border-bottom-color: #6699FF;
border-collapse:collapse;
border-color: #6699FF;
border-left-color: #6699FF;
border-right-color: #6699FF;
margin-left: 75px;
margin-top: none;
visibility: inherit;
background-color: #768B8C;
position: absolute;
}
#logoposition{
height:119;
width:170px;
background-image:url(images/logo.gif);;
float: inherit;
position: relative;
visibility: visible;
margin-left:76px;
z-index: none;

}
#banposition{
height:120px;
width:660;
position: relative;
visibility: visible;
float:inherit;
left: 200px;
top: 18
background-image:url(images/ban.gif);

}
#menu{
height:30;
width:1000;
position:relative;
background-image:url(images/homemenu2.gif);
visibility: visible;
margin-left: 75px;
margin-top: 75px;
float: inherit;
}

This is what I've done , I am not yet familiar with the CSS stuffs, so try to help me.
thank you

themarty
05-16-2009, 12:58 AM
There are a lot of conflicting stylecodes in your css. I couldn't really tell you which ones don't belong there since i don't know what you're trying to accomplish. The best way to approach a problem like this is to start basic:

html:

<div id="header">
<div id="logoposition"></div>
<div id="banposition"></div>
<div id="menu"></div>
</div>


css:

#header{
width: 1000px;
height: 229px;
background-color: #768B8C;
}
#logoposition{
height:119px;
width:170px;
background-color: blue;
}
#banposition{
height:120px;
width:660px;
background-color: red;
}
#menu{
height:30px;
width:1000px;
background-color: green;
}


Now you should be able to see something. Start adding small changes from here and look what kind of effect they have.

ludacruzz
05-19-2009, 03:41 AM
Thank you Thermaty,

Let me try it this way, but tell me if you use a background-image instead of background that it will works, because I want to put and positioning the images inside those DIV. Thank you!

themarty
05-19-2009, 05:45 AM
If everything is positioned correctly and has the right dimensions it will also work with background-images instead of background-colours. It won't have any effect on the position and dimensions of your divs