人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

CSSの設定方法を教えて下さい。

http://www.thabiland.com/ap-hopeland.html

上記ページ、ページ下の部分に
口コミカスタマーレビューという部分があるのですが、

Chrome は正しく表示されるのですが、IEでは正しく表示されません。

IEで正しく表示されるようにするには、スタイルシートをどのように書き込む、もしくは修正、すればよいでしょうか?
具体的には、口コミカスタマーレビューの見出し部分と、最後の口コミ投稿の部分が表示ズレしてしまいます。

どうぞよろしくお願いします。

●質問者: Tomo
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 4/4件

▽最新の回答へ

1 ● oil999
●25ポイント

http://www.thabiland.com/media/css/style.css
の .revttl クラスを以下のように変更してみて下さい。

.revttl {
margin: 0;
background: url(../../image/detail/bar_bk.gif) no-repeat left top;
width: 620px;
height: 25px;
padding: 3px 0 0 13px;
color: #FFF;
font-size: 16px;
line-height: 120%;
font-weight: bold;
text-align: left;
}

Tomoさんのコメント
回答ありがとうございます。 見出しの「口コミカスタマーレビュー」は、正しく表示されるようになりましたが、口コミレビューの一番最後の投稿の文末に大きく空白が空いてしまいます。 この問題は、どのようにCSSを設定すれば、解消できますでしょうか? 大変恐縮ですが、回答いただけると助かります。

oil999さんのコメント
CSSではなく、HTMLコードの下記の部分を見直してください。 >|html| <div class="rev_come" style="padding-bottom: 0;"> <iframe src="http://www.thabiland.com/review/post.php?id=147" width="595px" height="500px" scrolling="no" frameborder="0"></iframe> </div> ||< style="padding-bottom: 0;" を省くか、 iframe のheightを正しい値(これより小さくなるべき)にしてみてください。

2 ● 井戸端さん
●25ポイント

IEだけpaddinngの取り扱いが違うのよね。
http://www.nishishi.com/blog/2006/02/ie_padding.html

変更場所は244行あたりね。
http://www.thabiland.com/media/css/style.css
padding: 3px 0 0 13px;を消してmarginの値を調整してみて。


3 ● otusoham
●25ポイント

http://feed.mikle.com/guide/000115.html

こちらが参考になります。


4 ● kicr-pp
●25ポイント

http://park16.wakwak.com/~html-css/css/
参考に

関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ