floatプロパティは要素のボックスを左、または右に寄せて、その反対側に後続の内容を流し込ませるフロート（浮動化）を指定します。フロートは、回り込みとも言い換えられます。フロートできる対象は、内容領域（テキストや画像など、その要素の内容を表示する部分）、パディング（枠内余白）、ボーダー（外枠）、マージン（枠外余白）の4つの矩形領域をボックスと見立てた段落やフォームなどあらゆる要素が含まれます。ただし、positionプロパティで "absolute"、または "fixed" のいずれかを指定された絶対位置決めの要素を除きます。また、CSS2 の仕様において、適用対象から除外されていた生成内容の要素についても、改訂版の CSS2.1 の仕様では指定が可能となっています。ただし、"display : none ;" を指定された要素や適用対象にはなってもルート部（html要素と body要素）に対する指定は無効です。
noneleftrightinheritnonefloatプロパティに指定できる値のキーワードはそれぞれ以下の意味を示します。
noneleftright置換要素以外でフロートを指定する場合（置換要素は内在寸法が流用されるため）、必ず widthプロパティで要素の横幅を明示する必要があります。CSS2 仕様では、要素の横幅が明確ではないと、フロートを指定された要素の横幅は常に "0" とみなされます（CSS2.1 仕様では、width : auto ; であれば、横幅は 0 ではなく、"shrink-to-fit" width と呼ばれる、｢内容にぴったりと合うように縮んだ｣幅になるとあります）。ただし、UA 側の実装は横幅が指定されていなくても、適当な領域を勝手に確保するようになっているようです（これが、一応の shrink-to-fit width のようですが振る舞いは不安定）。なお、フロートを解除するには、後続のブロック要素に対して clearプロパティを指定します。
以下は、shrink-to-fit width についての仕様書からの翻訳です。なお、Roughly とあるように、これは概略であって、既存のフロートの横にフロートするときの横幅について書かれていないので、今後、このあたりの説明が付け足されることがあるかもしれません。
Calculation of the shrink-to-fit width is similar to calculating the width of a table cell using the automatic table layout algorithm. Roughly: calculate the preferred width by formatting the content without breaking lines other than where explicit line breaks occur, and also calculate the preferred minimum width, e.g., by trying all possible line breaks. CSS 2.1 does not define the exact algorithm. Thirdly, find the available width: in this case, this is the width of the containing block minus the used values of 'margin-left', 'border-left-width', 'padding-left', 'padding-right', 'border-right-width', 'margin-right', and the widths of any relevant scroll bars.
Then the shrink-to-fit width is: min(max(preferred minimum width, available width), preferred width).
shrink-to-fit width の計算は、自動レイアウトアルゴリズム（table-layout : auto ;）を使用しているテーブルのセル幅の計算と類似しています。概略：まず、明示的に行区切りが生じるところ以外では行を区切らずに内容を整形化する事によって、好ましい幅（preferred width）を計算します。次に、可能な限りの行区切りを試みるなどして、好ましい最小限の幅（minimum width）を計算します。CSS2.1 では、正確なアルゴリズムを定めません。第三に、利用可能な幅（available width）を包含ブロックの横幅から margin-left, border-left-width, padding-left, padding-right, border-right-width, margin-right の各値と関連するスクロールバーの横幅を差し引くことで見つけます。
つまり、shrink-to-fit width は次のようになります：最小（最大（好ましい最小限の幅, 利用可能な幅）, 好ましい幅）
body { text-align : center ; }
#container { width : 96% ; margin : 0 auto ; text-align : left ; }
#wrapper { width : 75% ; float : left ; }
#boxB { width : 66.7% ; float : right ; }
#boxC { width : 32% ; float : left ; }
#boxD { width : 24% ; float : right ; }
#boxE { width : 100% ; clear : both ;}
......
<div id="container">
<div id="boxA">A（ヘッダ）</div>
<div id="wrapper">
<div id="boxB">B（メインカラム）</div>
<div id="boxC">C（サイドバー1）</div>
</div>
<div id="boxD">D（サイドバー2）</div>
<div id="boxE">E（フッタ）</div>
</div>
floatプロパティは、ブロック要素をフロートさせる事で、疑似的に段組（マルチカラム）を表現する場合にも使われています。
http://w3g.jp/css/display_position/float直近の制作実績等：大阪人間科学大学 New! / 大阪薫英女子短期大学 New! / セキスイハイム みんなのお国じまん New!