適切な方法をオフにフッターを配置するためフロート
ほとんどの初心者CSSのユーザーも" "明確な財産のことを聞いたことがない。 私は過去に、私はしていなかったと時間は私のレイアウトが正しくフローティングサイドバーに表示するために取得しようとしている私の脳をひねったを知っている。 ここにはどのように動作する:
divsレンダリング時には、ブラウザを通常の流れ、そして後に物事の正常な流れで、次の1つの場所を1つの場所にされています。 divsな側面があるときにそばにするには、通常の解決策"プロパティ彼らには、 "フロートを追加することです。 以下の場合は、両方の"左ナビゲーション" divをして"コンテンツ"事業部は、プロパティ"フロート:残っている; " 。 私たちの内側divs浮上して、コンテンツを置くことができますし、幸せなレイアウトをしている。 この問題は、物事の正常な流れでは、レイアウトを続けることはないので、物事をプッシュするのブラウザダウン通知する必要があります。 これらの2つの例に注意してください:
誤:
<div id="wrapper"> <div id="left-nav"> ... < / divを> <div id="content"> ... < / divを> < / divを> <div =アイダホ"footer"> <p>このテキストの浮上divsの下に隠されている! ! < / divを>
正しい:
<div id="wrapper"> <div id="left-nav"> ... < / divを> <div id="content"> ... < / divを>
<div style="clear: both;"> < ! -明確な山車- -></部> < / divを> <div =アイダホ"footer"> <p>私のフッターは現在、フロート要素の下に表示されます! ! < / divを>
それは小さな一行"行く"を維持するには、ブラウザの指示や下の流れを移動します。 このテストする最も簡単な方法" "背景色のラッパーを与えると、 2つのコード片の違いで各要素のコンテンツがある場合ですね。
ハイテクインタラクティブなウェブ2.0の例:
例1 (誤った) :
+--(#ラッパー)---------------------------------+ | +-----------+ +--------------------+ | +---| |----| |---+ | | | | | | | | | | | | | | | | | #左ナビゲーション| | #内容| | | | | | | | | | | | | | | | | | | | | | | | | +-----------+ +--------------------+
例2 (正しい) :
+--(#ラッパー)---------------------------------+ | +-----------+ +--------------------+ | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | #左ナビゲーション| | #コンテンツ| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | +-----------+ +--------------------+ | | | | + ---クリア:両方----------------------- + | | | +---------------------------------------------+
| 290 |
それつまずく! 投稿情報
このエントリを2007年12月31日(月)に掲載されたCSSの下で、 デザイン を提出されています。 閲覧回数は201しているコメントフィード 。 | ままにコメントする | トラックバックにしておきます。
前のポスト:あなたの サイトにはフラッシュ全体»のGoogle Analyticsのコードを追加します。
次の投稿: AJAXのお問い合わせフォーム »
ほとんどの記事を閲覧

























