Webdesign, chapter eight: CSS media query (fixing chapter 6 !)

I just wanted to post a quick entry about the chapter 6 that I kinda screwed up.
In the mean time I have remade the layout that I had wanted to use for my website using float instead of fixed position. I do think that it should work using fixed position, but it apparently does not.
Mainly we just have 2 lines that give us the 2 column layout that we would like to have:
div.sidebar-left-outter {float: left; width: 15%; height: 100%; }
div.main-outter {float: right; width: 85%; height: 100%; }

And then in the media query CSS file we have the following block of code:
@media screen and (max-width: 799px) {
div.main-outter, div.sidebar-left-outter {float: none; width: auto; height: auto; margin: 0 auto;}
}

So mainly we're just clearing the float to make text not float around our 2 columns (which it never does, which is why I think it's a misapplication of the float property, but many people recommend doing it this way), then we set the width to auto, which tells the browser to use all the available space. Obviously we can't have 100% height on both elements that both use 100% width, since then we could only see one of them, and we set the margins to 0.