One issue I'm facing is that when I resize my page, the body content ends up in the fixed menu area.
I have been using a combination of pixels and percentages, but how can I prevent this from happening?
Check out this example on jsfiddle
<div class="menu">This is the menu</div>
<div class="body">This is the body content</div>
.menu{
height: 100%;
position: fixed;
background-color: red;
width: 200px;
float: left;
}
.body{
background-color: yellow;
float: right;
width: 60%;
}