By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,077 Members | 1,175 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,077 IT Pros & Developers. It's quick & easy.

CSS: How do i make a .div go behind all the other .div's for a background?

P: 5
Please help! i have everything set up with my CSS HTML layout and its all good. im using 3 divs at the moment and what i want to to do now is to add a new div with a background for the page. My problem is i don't know how to make it go behind all the other divs. can anyone help?

These are the .div's i have created and .div3 is the .div i have been using to try and become the background

.div0 {
background-color:black; color: purple;
border:4px solid; border-color: Purple;
width:106px; height:300px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-400px; margin-top:635px; text-align:center;
visibility:visible;}

.div1 {
background-color:black; color: purple;
border:4px solid; border-color: Purple;
width:670px; height:300px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-270px; margin-top:635px; text-align:center;
visibility:visible;}

.div2 {
background-color:black; color: purple;
border:4px solid; border-color: Purple;
width:250px; height:460px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:150px; margin-top:150px; text-align:center;
visibility:visible;}
marquee { z-index:8; }
table div, span, td td td, table div div { visibility:hidden !important; }
.bbzContainer div, .bbzContainer div font, .bbzContainer div a, .bbzContainer div div, .bbzContainer font a, .bbzContainer span, .bbzContainer div table a, .bbzContainer div table img, .bbzContainer div table font, .bbzContainer div table, .bbzContainer div table td, .comt, .comt td, .comt span, .comt a, .comt div {visibility:visible !important;}

.bbzDiv {content:"Overlay Generator beta";}

.div3 {
background-color:black; color: purple;
border:4px solid; border-color: Purple;
width:820x; height:505px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-410px; margin-top:140px; text-align:center;
visibility:visible;}
May 3 '07 #1
Share this Question
Share on Google+
7 Replies


P: 70
I would tend to believe that the most correct solution would be html side.

example:
<div id="background">
<div id="1">
<div id="2">
</div>
</div>
</div>
May 3 '07 #2

P: 5
I did that and now the image is hanging at the bottom of the page and not where i want it to be i used <style> to set where the margins are but didnt work! :S
May 4 '07 #3

drhowarddrfine
Expert 5K+
P: 7,435
Can't you use the body?
In css:
body{background-image:url("your_image.png")}
May 4 '07 #4

P: 70
That would be an even better fix.
May 4 '07 #5

P: 5
ye i was just trying to make if fancy :/ is ther anyway to put borders around images done in body?
May 4 '07 #6

drhowarddrfine
Expert 5K+
P: 7,435
You can still use a div if you want to. Just wrap all that in a div and give it an 'id'. I used the name 'test'. Then, in CSS:
Expand|Select|Wrap|Line Numbers
  1. html,body{height:100%}
  2. #test{
  3. background-image:url("your_image.png");
  4. height:100%;
  5.     }
EDIT: Yes, you can add a border to the body tag.
May 4 '07 #7

P: 5
thankyou all for all the help you given me i got it going now :) o and sorry for being such a noob!
May 4 '07 #8

Post your reply

Sign in to post your reply or Sign up for a free account.