ソーシャル・マーケティング協会 代表理事 白鳥友康の公式ブログ。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万円で提供していた【ソーシャル・マーケティング認定コンサルタント養成講座】のエッセンスを凝縮した動画を無料プレゼントしています。

ダウンロードはこちら

  関連記事

no image
3大ブラウザのJavaScript実行速度について

昨日、各ブラウザの特徴を説明しましたが、 IE、Firefox、Chrome 3大ブラウザ対決 JavaScriptの実行速度に…

post_h268_20130103
Facebookだけじゃダメ。他のメディアも使わないと!

Facebookを活用して集客することはもちろん可能ですが、Facebookは他のメディアと組み合わせてこそ、その本領を発揮しま…

HTML5_logo_and_wordmark.svg
HTML5で廃止予定の要素と属性

ブログなどを使って投稿すると、自動的に挿入されてしまうタグが多数ありますね。 現在でも推奨はされていないが、頻繁に使われているタ…

Logo Garden
素人でも簡単にロゴが作成できる便利なサービス

何かのサービスを立ち上げるの時には、ロゴが必要になることが多いので、こういったサービスは嬉しいですね。ある程度のデザインセンスは…

IE5.5, IE6, IE7, IE8の確認が同時にできる -IETester

ホームページを公開するときに大切なのが、複数のブラウザで表示を確認すること。 Internet ExplorerFirefoxG…

Zemanta Related Posts Thumbnail
SEO対策するキーワードの選び方?メインキーワード編(2)

―知っておきたいSEO対策の基礎9 目次1 最初にコア用語を見つける2 前記事 最初にコア用語を見つける ブレインストーミングと…

no image
IE、Firefox、Chrome 3大ブラウザ対決

先日、Google Chrome 4 が公開されたお知らせをしましたが Google「Chrome 4」正式版リリース &#82…

2015-12-08 20.05.00
ホームページを外注したいけれど、いくら掛かるのか不安…

コンサルタントとして独立して活動すると、契約を結ぶ際にウェブサイト制作を一緒に受注することは意外と多いもの。でも、ウェブサイトの…

o0800077110456654354
ColorBar Generator ? カラーバージェネレーター ?

ColorBar Generatorは、好きな画像からその画像のイメージに合うようなオシャレ(死語)カラーバーを生成します。 適…

tour_1
jQueryを使ってサイトツアーを作る方法

これはいつか使いそう。 というか、必ず使いたい! jQueryを使ってサイトツアーを作る方法 – IDEA*IDEA…