One easy way to do this is to have a container div (along with the rest of the page) set to a width of 1000px, and set it to overflow: auto. Then make the inner div (with the panels) set to width: 3000px. E.g.
Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Experiment</title>
<style media="all">
* {margin: 0; padding: 0;}
body {background: #f7f7f7;}
.wrapper {width: 1000px; margin: 0 auto; background: #e7e7e7;}
.scroll-outer {width: 100%; overflow: auto;}
.scroll {width: 3000px; min-height: 400px; background: white;}
.footer {width: 100%; padding: 50px 0; background: #d7d7d7; margin-top: 10px;}
</style>
</head>
<body>
<div class="wrapper">
<div class="scroll-outer">
<div class="scroll">
</div>
</div>
<div class="footer">
</div>
</div>
</body>
</html>
Reply With Quote
Bookmarks