Background Image Positioning
Usually I don’t run into problems, but I absolutely cannot figure this out. I haven’t actually ever run into this styling issue…
Here is an illustration of what I want:
My issue is the background image. I cannot get it to stay static on at that position when a user changes the screen size small or bigger.
It needs to stay at the bottom left pulled out a bit away from the container.
Here is the code:
<body>
<div class="bg">
<div class="container">
container contents
<!--end container--></div>
<div class="footerbg">
<div class="footer_container">
footer contents
<!--end footer_container--></div>
<!--end footerbg--></div>
<!--end bg--></div>
</body>
body
{
background-color:#FFF;
background-image:url(img/bg.jpg);
background-repeat:repeat-x;
height:773px;
font-family:Arial, Helvetica, sans-serif;
}
.bg
{ background-image:url(img/globe.png);
background-repeat:no-repeat;
overflow:hidden;
background-position:bottom left;
background-attachment:fixed;
}
.container
{
margin:0 auto;
height:100%;
width:930px;
}
I am also using 2 background images, that’s why I had to make the .bg. I know there is CSS3 for this, but I can’t even figure this out. What I marked up is completely wrong I know 
Any help would be greatly appreciated!
View full post on Tycoon Talk
background, image, Positioning
RSS Site Feed