Eliminate horizontal scrolling in div in favor of horizontal scrolling in browser window
- by Casey Flynn
I have a div, set to 800px wide, that will automatically scroll horizontally if the browser window is resized to < 800px. The behavior I would like, is to have the browser window scroll instead of the div. It would seem simple but for some reason I'm getting hung up on it. Any ideas?
The page in question:
http://www.caseyflynn.com/game/
The div CSS:
div#main_container {
border: 1px solid #FFF;
width:800px;
margin-left:auto;
margin-right:auto;
padding:0px;
background-color:#FFF;
overflow:hidden;
}
The BODY CSS:
html, body {
background-color:#000;
border:0px;
margin:0px;
padding:0px;
font-family : Arial, Helvetica, sans-serif;
font-size : 62.5%;
overflow:auto;
}
I'm assuming anyone looking at this will have the ability to see the HTML and the CSS. Thanks!