body: overflow-x - still able to scroll over with trackpad

css, css-position, overflow, trackpad

Solution

If you're not limiting the height of #container, just set overflow to hidden, as overflow-x is strange in that it removes the scroll bar, yet still allows you to scroll.

Example

body {
    overflow-x: hidden;
}

#container {
    overflow: hidden;
    width: 100%;
}

Problem

I have a div with `position: absolute` set and it's just a tad bit wider than my browser window. I've successfully hidden the horizontal scroll bar, but I am still able to scroll over with a Macbook trackpad. Is there any way to circumvent this? ``` <div id="container"> <div id="big-image"></div> </div><!-- #container --> #container { overflow-x: hidden; } #big-image { background: transparent url('/path/to/image.png') no-repeat center top; position: absolute; width: 1307px; left: 50%; margin: 0 0 0 -653.5px; z-index: 4; } ```

Original source