Have Geek Brain

How do I keep the focus image of the centralized background image?

http://www.goodshow.tv

I am having problems with the background image. The layout looks correct if the browser is wide enough, but when you make it too narrow, the background continues to move to the left. Is there a way to keep it from moving?

0


a source to share


5 answers


This issue occurs when the page width is smaller than the <div id="body">

div's, causing the div to no longer center itself. I found that I was able to fix this problem in Firefox by at least adding:



html { min-width: 980px }
+3


a source


Remove the white part with the background image and make the white background of the sidebar white using the CSS background rule. Add the image to the right side only. Maintain the width of the left sidebar.



+1


a source


I wonder if it has something to do with the use of body and #body css selectors (one for the tag with the name body

and one for the div with the namebody

Is the intent that the nav area has a white background and the #content div has an image background?

Could you try this instead of what you have?

body {
    margin: 0px;
    padding: 0px;
}
#content {
    background-color: #333;
    background-image: url(../images/bg.png);
    background-repeat: repeat-y;
    background-position: center;
    float: right;
    width: 720px;
    padding-top: 35px;
    padding-left: 0px;
}
0


a source


Can't you just encapsulate the entire left side with a white background div?

0


a source


I think the problem is that both the navigation area and the content area are floating and the content is absolute width.

The quickest fix is ​​to set the background color of #nav to white. This will still cause problems for the title (Good Show and A creative studio in Atlanta), but I think you need to watch again how you make this chunk (they are only 2 images)

It's probably better to have 2 columns all the way to the top, and these images can be in a div with a fixed height at the top of each

0


a source






More articles:


All Articles