CODEWITHSUNDEEP
css
Irfan Mir
Irfan Mir

Reputation: 2175

something is causing a horizontal overflow on the body, but I can't tell what it is?

In the page below, something is causing some padding on the body or html on the right and that overflow is causing a scroll on the x axis.

How can I remove that overflow?

I've already applied

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

Here is the page: https://dl.dropboxusercontent.com/u/270523/help/new.html

Does anyone know what is causing this overflow / space to the right, but inside the document and how to remove it?

Upvotes: 0

Views: 50

Answers (3)

showdev
showdev

Reputation: 29168

To repaire the 5% margin overflow, I suggest changing the CSS for #searchInput to add display:block; and change margins to margin:0px auto;.

#searchInput {
  ...
  display: block;
  margin:0px auto;
}

Upvotes: 1

pzin
pzin

Reputation: 4248

As @Kaloyan Ivanov says, it comes from your input element. You just need to adjust borders and margins so that they together aren't more than 100% or you could also change the CSS box-model for this single input with:

input#searchInput {
  box-sizing: border-box
}

Upvotes: 0

Kaloyan
Kaloyan

Reputation: 7352

It's your #searchInput - it has 90% width, 2x5% margin and border .. so the border causes it to go beyond 100%.

Upvotes: 0

Related Questions