...

View Full Version : Please help! Background moving on browser resize and footer issue



FionaE
05-30-2012, 10:22 AM
Hi

I really hope someone can help me, this is driving me CRAZY! I'm reasonably new to this, so please excuse me if my coding is a mess.

Ok, the story is my background is moving to the left, but only on all pages except the home back where the background is set to scroll (the others are fixed). The background image is set within two containers (#container and #containerall) and both perimeaters are the same. Positioning is relative for both of these.

I am going bonkers trying to fix it, and I don't know any developers! Please help me!

Here is the css coding. I've taken out everything bar the two containers and the footer, please let me know if you need to see the whole thing. The website isn't live yet, so I unfortunately I can't give you a web address. On a side note, sidebar footer and maincontent footer are within the footer div.

Any help you could give me would be HUGELY appreciated. I have looked for solutions for this, but can't seem to find it :( Also, this is happening in every browser I test so far.

*Update on the footer issue, with it dropping beneath the container. Turns out it was an overflow issue, yay! One resolved! However, I have left the footer in the coding below, as its coming up with a compatibility issue on the browser check. I tried taking the size out but that makes my whole background image dissapear. If anyone can see obvious flaws with this please let me know.*


Thanks
Fiona



html, body {
margin: 0px;
padding: 0px;
}


/* ^2 --------------- limited-scale reset ---------------- */
h1, h2, h3, h4, h5, h6, p, div, ul, li {
margin: 0;
padding: 0;
border: 0px;
}

p {
margin: 1em 0;
}

#container {
background-image: url(Home/homepage.jpg);
background-repeat: no-repeat;
width: 980px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
position: relative;
background-position: center top;
background-attachment: scroll;
overflow: hidden;
}

#containerall {
background-image: url(web-background.png);
background-repeat: no-repeat;
background-position: center top;
width: 980px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-attachment: fixed;
position: relative;
overflow: hidden;
}

.clearboth {
clear: both;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}

#footer {
clear: both;
width: 980px;
}

#sidebarfooter {
float: left;
width: 223px;
margin-top: 30px;
margin-right: 20px;
margin-bottom: 0px;
margin-left: 40px;
border-top-width: thin;
border-top-style: solid;
border-top-color: #DFA5AD;
font-family: Arial, Helvetica, sans-serif;
font-size: 0.7em;
color: #BA666D;
}

#maincontentfooter {
font-family: Arial, Helvetica, sans-serif;
font-size: 0.7em;
color: #333;
float: left;
width: 632px;
margin-top: 30px;
margin-right: 35px;
margin-bottom: 0px;
margin-left: 30px;
border-top-width: thin;
border-top-style: solid;
border-top-color: #BA666D;
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum