忍者ブログ
[112]  [111]  [110]  [109]  [108]  [107]  [106]  [105]  [104]  [103]  [102
×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

画像置換をしたリスト画像がうまく表示されません。*WebDesignerを目指しております。スキルアップの為いろんな本を読み、意味的構造の大切さを知り、以前個人的に作ったサイトのコードの見直しを行っておりますが、どうしても画像置換をしたリスト画像をうまく表示・フロートさせる事ができません。色々検索して調べてみたものの、フロートさせる前からすでに画像が一枚欠落する表示崩れが生じており、いつまで経ってもindexページで見直しが止まってしまいます。どなかたご教授お願い致します。CODE*清潔な院内3DCTレントゲンウォーターレーザー無料送迎サービスCSS*#subcateli{list-style:none;margin-right:20px;text-indent:-9999px;}#subcatelia{display:block;width:160px;height:90px;}.clean{background-image:url(../image/index/clean.jpg);}.3dct{background-image:url(../image/index/3dct.jpg);}.water{background-image:url(../image/index/water.jpg);}.car{background-image:url(../image/index/car.jpg);}現在フロート指定はしておりませんが、CSSのliタグ内にfloat:left;と入れると画像自体
が表示されません。4枚の画像を綺麗に横並びに20px間隔をあけて表示させたいのですが、どこを見直しすれば良いのでしょうか?それともテーブルタグを使用するのが良いのでしょうか?検索した際にリストタグは縦書き用に作られた物なので横並びへの対応力はあまりないと書かれていましたが、プロの方はどうのように書かれているのでしょうか?ご教授の程よろしくお願い致します。DreameweaverCS3使用XHTML1.0Transitionalを定義テスト環境:IE7、IE8、Firefox3.6、Safari5.0すべてで表示不可テストページを上げておりますので、お手数ですが見て頂ければ幸いです。どうぞよろしくお願い致します。

ベストアンサー

classを数字かハイフンで始めることはできない#subcateli{~}にfloat:left;でIE8、FF3.6、Chrome8でお望みどおりになりましたが






PR
バーコード
忍者ブログ [PR]