以下のように指定するとfloatをclearできる模様。 <div class="Box1"> <div class="L">something long text</div> <p>something short text</p> </div> .Box1{ width:400px; overflow:hidden; } .L{ width:130px; float:left; } overflow:hiddenでfloatをclearしたサンプル これで:afterでゴニョゴニョやったりclear:bothを利用しなくてもfloatがクリアできるみたいです。以下のページで知りました。 画像が消えたり、繰り返さなかったり系が解決しそうなこと overflow:hiddenって、飛び出たのクリップされるんでないの？ しかし、普通に考えると、これでなぜfloatがクリアできるかは甚だ疑問です

もう古いけど、前は役になったのでメモとして残しておきます。 IEでよくおこるCSSの問題は、おもにhasLayoutが影響している。 hasLayoutについては。ウノウラボさんのhasLayoutとは何かの説明がわかりやすいので参考に。 すべてをtrueにしてしまうと問題もおこる。 IEは、ul や ol のリストマークは、hasLayoutがtrueだと消えてしまう。 IE6 や IE7 で垂直方向の margin が相殺されない。 hasLayoutをtrueにして、くずれを防ぐ hasLayoutが原因で、IE7が拡大・縮小したときにレイアウトが重なってしまったり、フロートした要素がはみ出てしまったりする場合がある。 対処方としては、下記のいずれかを追加すればいい。 display:inline-block; height:1%;のようにheightに数値をいれる。 float p

面白い物を見つけたので遊んでみました。 IE6以下ではボックスモデルの解釈やマージンの効き方が色々と特殊です。 IEでのみ動作確認していないために他のブラウザで大きく崩れているサイトもいくつか見かけます。 そうならないためにハックを使ったりなどして対処します。もう当たり前過ぎの作業になっていて悲しくなりますね。 しかし、「IE7.js」というライブラリをスクリプトを埋め込む要領でhead内に記述しておけば、IE6以下の挙動がCSS/XHTMLの仕様通りに動いてくれます。ハックが必要なくなるわけです。 IE6でよく陥りそうな動作の違いをピックアップしてIE7.jsを適用してみました。といってもほんとはIE7.jsの配布先に検証ページがあるんですけどね。 以下のページはIE6以下で見て違いを比べてください。 →IE7.jsなし →IE7.jsあり すごいですね。IE7.jsありでは仕様通りに動

サービス終了のお知らせ いつもYahoo! JAPANのサービスをご利用いただき誠にありがとうございます。 お客様がアクセスされたサービスは本日までにサービスを終了いたしました。 今後ともYahoo! JAPANのサービスをご愛顧くださいますよう、よろしくお願いいたします。

This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

複数のアイテムを特定の条件で表示したり、非表示にするフィルタリングをCSS3のエフェクトを使ってかっこよく実装するチュートリアルを紹介します。 Filter Functionality with CSS3 [ad#ad-2] チュートリアルでは3種類のエフェクトを使って、フィルタリングを実装しています。 各デモはページ上部の「ALL」「WEB DESIGN」「ILLUSTRATION」「ICON DESIGN」をクリックすると、フィルタリングを実行します。

CSSもHTMLと同じように、ソース中にコメントを挿入することができます。 /*と*/で囲った文字列がコメントになりますが、入れ子にすることはできません。また、他のプログラムにあるような「#」や「//」といった単一行コメントはありません。 適切なコメントを挿入することで、複数人での作業するときや、時間がたってから編集するときなどにコードの見通しが良くなります。ブラウザ間の差異を埋めるための宣言やハックなんかも、適用させるブラウザ名や理由などをきちんとコメントで書いておきたいですね。 僕は、スタイルをグループに分けて記述するときなど、コメントを目立たせるために次のように記述しています。 /* ------------------------------ Header ------------------------------ */ div#header { } . . /* -------