Módosítottam a tanácsodra a kódon (most csak a css-t másolom ide)
<style type=''text/css''>
body {
margin: 0;
padding: 0;
border: none;
/*position: relative;*/
/*font-family: verdana, arial, sans-serif;*/
}
div {
margin: 0;
padding: 0;
border: none;
}
.top {
height: 60px;
background-color: teal;
color: #fff;
font-size: 36px;
}
.container {
}
.menu {
float: left;
/*display: inline;*/
width: 180px;
background-color: teal;
overflow: none;
}
.inner {
background-color:#D6F0F0;
overflow: auto; /* This property will allow the block to be scrollable */
font-size: 14px;

}
.bottom {
/*width: auto;*/
height: 30px;
background-color: teal;
/*color: #fff;*/
font-size: 12px;
}
</style>

Így néz ki ie6 alatt:
[link]
[link]
és ff2 alatt:
[link]

Ahogy ff2 alatt megjelenik az majdnem jó, kivéve (2b)

(1) Látható, hogy ie6 mintha tenne egy kis paddingot, csak azt nem értem miért. Ennek elvileg nem kéne ott lennie
(2a)ff alatt a menü és a belső rész két külön oszlopban jelenik meg, így szeretném. Ie esetén a menüt körbefogja az inner rész. Ez az ie vagy az én hibám?
(2b)Igazság szerint azt szeretném, hogy a menü addig érjen, amíg a bottom részbe nem ütközik, magyarul olyan magas legyen, mint az inner rész. Ám ez állandóan változik, nem állandó, azt szeretném, hogy az inner magasságához igazodjon a menü magassága is.

Lehet, hogy most sem tudtam pontosan elmondani, de a képek beszédesebbek.

[Szerkesztve]