CODEWITHSUNDEEP
htmlcssimagebackgroundoverflow
Raj Kothari
Raj Kothari

Reputation: 3

Body Overflowing on background

For my homepage I have a background set as width: 80%; and then aligned to center.

Homepage: homepage

For this I have used the following code:

<body id="top"style="height:100%;overflow-x:hidden;background:red;" bgcolor="#FF0000">

Now when I zoom the size of the browser it goes like this:

image 2

How can I stop this from happening?

Upvotes: 0

Views: 60

Answers (3)

user3173360
user3173360

Reputation:

Because you are using percents it will always adjust to your screen, so when you have a screen of 1024 px width it will be 80% of that, but if you resize it to 700px, it will be 80% of that.

Did you use percents on other elements? It's not a bad habit to use them, only you should use them in an element with a fixed width to prevent stuff like this.

Upvotes: 0

Anand Natarajan
Anand Natarajan

Reputation: 1162

body{
 width:80%;
 margin:0 auto;
}

Upvotes: 1

Rohit Azad Malik
Rohit Azad Malik

Reputation: 32192

Define just your body min-width

body{
min-width:1000px; // width of you main container 
}

Upvotes: 0

Related Questions