Code:
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>layOut017</title>
<style type="text/css">
*{margin:0;padding:0;color:gray}


.overflowHidden{overflow:hidden}

.bdr2{border:2px}
.b-r15{border-radius:15px}

.solid{border-style:solid}
.bdColorGray{border-color:gray}
.bgColorSilver{background:silver}
.bgColorYellow{background:yellow}
.bgColorLavender{background:lavender}

.colorWhite{color:white}
.floatL{float:left}
.floatR{float:right}

.alignLeft{text-align:left}
.alignCenter{text-align:center}

.pdg5{padding:5px}

.fEm05{font-size:0.5em}
.fEm2{font-size:2em}
.fEm3{font-size:3em}
.fEm4{font-size:4em}
.fEm5{font-size:5em}

.m-t5{margin-right:50px}
.m-r5{margin-right:5px}

.inlineBlock{display:inline-block}
.clearBoth {clear:both}

.hite5{height:5px}
.hite10{height:10px}


</style>
</head>
<body class="pdg5">


<div>
  <div class="fEm5 floatL bdr2 b-r15 bdColorGray pdg5 solid m-t5 m-r5">sub</div>
  <div class="fEm5 floatL bdr2 b-r15 bdColorGray pdg5 solid">logo</div>
  <div class="fEm5 floatR bdr2 b-r15 bdColorGray pdg5 solid">guest</div>
</div>


<div class="clearBoth hite5"></div>
<div>
  <div class="fEm5 floatL bdr2 b-r15 bdColorGray pdg5 solid m-r5">navigator</div>
  <div class="fEm5 floatL bdr2 b-r15 bdColorGray pdg5 solid">title</div>
  <div class="fEm5 floatR bdr2 b-r15 bdColorGray pdg5 solid">logIn</div>
</div>

<div class="clearBoth hite5"></div>
<div class="alignCenter">
  <div class="fEm5 floatL bdr2 b-r15 bdColorGray pdg5 solid">left<br>Menu</div>
  <div class="fEm5 floatR bdr2 b-r15 bdColorGray pdg5 solid">right<br>Menu</div>
  <div class="fEm5 pdg5">

    <div class="inlineBlock bgColorLavender">screen/<br>contents</div>

  </div>
</div>


<div class="clearBoth hite5"></div>
<div>
  <div class="fEm5 floatL bdr2 b-r15 bdColorGray pdg5 solid m-r5">search</div>
  <div class="fEm5 floatL bdr2 b-r15 bdColorGray pdg5 solid">writer</div>
  <div class="fEm5 floatR bdr2 b-r15 bdColorGray pdg5 solid">footer</div>
</div>



</body>
</html>
I have the code above at http://dot.kr/x-test/layOut/017.php.

I like to put the "search and writer box" AND "footer box" to bottom of any browsers.

so I tried the code below at http://dot.kr/x-test/layOut/017_1.php, but failed.
Code:
.floatB{float:bottom}
How can I put the "search and writer box" AND "footer box" to bottom?

(if a browser's height is taller than the height of the contents, the boxes should be in the bottom.
if a browser's height is not taller than the height of the contents, the scroll bar will be appeared.)