ソーシャル・マーケティング協会 代表理事 白鳥友康の公式ブログ。Facebook、Twitter、YouTube、LINEなど、ソーシャルメディアを活用、集客する方法を無料でお届け。

ソーシャル★マーケティングの教科書 改訂版

IE6でclearfixのためにoverflow:hidden指定するときの注意事項

 投稿日時:
 最終更新日時:2014/08/04 15:08

この記事は約 2 分で読めます。

大丈夫、あなたなら出来る! 
ソーシャル・マーケティング協会 代表理事の白鳥友康です。

$売れる!ホームページの作り方

要素をfloatしたときに、その親要素に overflow:hidden; を設定することは良くあると思います。その際は、InternetExplorer 6(IE6)の時だけ注意が必要。

overflow:hidden; を設定した要素の hasLayout が On になっていないと clearfix の効果がありません。こんなときは IEバグの魔法の呪文 zoom:1; を指定しましょう。

★HTML

<div class="box">
 <img src="img/photo.jpg" class="photo" alt="" />
  <p>dummy text. dummy text. dummy text. dummy text. dummy text. dummy text. dummy text. dummy text. dummy text. dummy text. dummy text. dummy text. dummy text. dummy text. </p>
<!-- /[.box] --></div>

CSS

.box {
  overflow:hidden;
    zoom:1; /* for ie6 */
}
.box .photo {
 float:left;
 width:100px;
    margin:0 10px 10px 0;
}

◯clearfixでfloatを解除 | d-spica
http://blog.d-spica.com/entry/070307clearfix.html

カテゴリ - ◆ウェブサイト・ホームページ制作, ウェブデザイン
タグ - 

無料プレゼント

【Web担当者向け】SNS集客の全体像を55分で把握できる動画

受講料50万円で提供していた【ソーシャル・マーケティング認定コンサルタント養成講座】のエッセンスを凝縮した動画を無料プレゼントしています。

ダウンロードはこちら

  関連記事

2011年11月最新ニールセン調査。いつもお世話になっています。

10月の調査でmixiの数値が激減したことで「mixiオワタ」的な盛り上がりを見せていましたが、そもそもの計測方法が間違っていた…

no image
ウィンドウを2分割して表示するChromeのアドオン「Split Screen」

ホームページ制作をしていると、表示のチェックするために複数のブラウザウィンドウを開くので、デスクトップにウィンドウがたくさんあっ…

Zemanta Related Posts Thumbnail
便利なjQueryプラグインとチュートリアル45個

ツールチップとか、いろいろ使ってみたいものがたくさん。jQuery楽しいなぁ。 ■UIをブラッシュアップする便利なjQueryプ…

Web Design Layout Homepage Idea Design Software Concept
ランディングページはやっぱりヘッドが命

クライアント様から依頼を受けて、月曜日にヘッドコピー部分のデザインを差し替えたランディングページがあるのですが、早速「2個売れま…

file folder with three csv symbol
★ウェブサイトの情報をCSVでダウンロードして利用する。

例えば、ある地域にある不動産の物件情報をExcelなどを利用して自社で解析したいとする。対象のデータは、賃貸ポータルサイトの検索…

130924_fo
Facebookカバー画像もPhotoshop無しで簡単に作れる

Facebookのカバー画像は、あなたの魅力を伝えるのに効果的。 通常は、Photoshopなどの画像編集ソフトを使って作成する…

top5
★ホームページ診断で必ずチェックしたい指標

弊社でウェブサイト診断を行う際のチェック項目は、たくさんあるのですが、まずはアクセス解析のデータをチェックして欲しいです。 アク…

Diversity Casual People Web Design Meeting Brainstorming Concept
最も売れるランディングページを作れる人は誰か?

ここ数ヶ月間、ちょこちょことランディングページの調整をさせていただいているクライアント様から、また販売実績のご報告をいただきまし…

no image
xserver のデータベースに外部から接続する方法

これハマりました。貴重な情報ありがとうございます。 《参考サイト》◯転ばぬ先の備忘録 xserver外部からのデータベース接続方…

2015-04-17_081735
ウェブサイトの出口をしっかり整理する

ウェブサイトは、入口と出口が最も重要です。多くのウェブサイトは、お問い合わせフォームが出口になることが多いですよね。そういったメ…