Samuel
Samuel

Reputation: 18586

Fix horizontal scrolling in webpage

I am currently working on a side project and i ran into something annoying: When my browser size is smaller than around (1280 | something) the content is not entirely viewable. I can scroll to the right to see whats there, but not to the left.

html:

<div id="wrapper">
 [...]
</div>

css:

#wrapper {
 position: absolute;
 width: 1200px;
 margin-right: -600px;
}

Upvotes: 1

Views: 696

Answers (2)

Rachel McMahan
Rachel McMahan

Reputation: 392

Specifically, margin-left: -600px is your problem. I agree with Diodeus. Absolute positioning and tables are generally frowned upon.

Upvotes: 0

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114417

Your centering technique is wrong.

use:

#wrapper {
  margin-left:auto;
  margin-right:auto;
  width: 1200px;
}

Also, using absolute positioning for layouts is generally a bad idea. Learn how to use floats, and get rid of the TABLEs too.

Upvotes: 1

Related Questions