要素を右/左寄せに回り込ませるfloatプロパティ
float

 floatプロパティは指定した要素を右寄せや、左寄せにして配置できるプロパティです。

 positionプロパティの値が、static以外の場合には適用されません。回り込みを利用して、2カラムや3カラムといった複数カラムのレイアウトを組む場合に利用されます。

基本データ

構文 セレクタ{float: 値;}
継承 ×
「left」「right」「none」
効果 floatプロパティのleftが設定された要素は、左に回り込み、rightが設定された要素は右に回り込む
初期値 none
適用個所 すべての要素(一部例外あり)

例:

ほげほげですね。

<p style="float: left;">ほげほげですね。</p>
<img src="/fwcr/design/cssref/images/gt.gif" width="376" height="50">

動作Webブラウザ

Internet Explorer IE 4以上
Firefox 全バージョン
Safari全バージョン
OperaOpera 6以上
Chrome全バージョン
iPhone/iPad 全バージョン

標準JavaScriptによるDOMでの参照方法

[window.]document.getElementById("【ID属性値】").style.cssFloat

jQueryを使った参照方法

$('【セレクタ】').css('float','【値】');
$('【セレクタ】').css({'float':'【値】'});

有限会社タグパンダ
喜安 亮介




HTML5 + UX フォーラム 新着記事
@ITメールマガジン 新着情報やスタッフのコラムがメールで届きます(無料)

注目のテーマ

デザインハック 記事ランキング

本日 月間