Menu
I'm trying to create a website with the following.
On top there's just a basic horizontal menu. Below that, on the left side, is another subcategory. The content will be on the right of the subcategory and can be very long.
Now what I would like is that when you scroll anywhere on the page, it only scrolls the content div while everything else stays at its original position. I have been thinking about it for some hours now but I cannot really come up with a solution on how to do this.
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="container">
<div class="left_side"></div>
<div class="right_side"></div>
</div>
</body>
</html>
.container {
width:1000px;
}
.left_side {
float:left;
width:250px;
height:500px;
background:green;
}
.right_side {
float:right;
width:750px;
height:1500px;
background:yellow;
}
Any idea on how to do this? Thanks in advance.
265
Answer was given by @jao's comment. Setting all divs, except for the content one, to position: fixed.
144
Add the overflow:auto style to its class.
Full explanation: http://www.w3schools.com/cssref/pr_pos_overflow.asp
36
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
