ようこそ ゲスト さん、新規登録（無料）して気になる疑問を解決しませんか？
はじめての方へ｜ヘルプ｜FAQ

質問
QNo.3998993 CSSのリストタグでメニューを作ってますがレイアウトが崩れます
質問者：yasudive CSSでリストタグを使ってメニューを作成してますが、Firefoxだとメニューの幅が広く表示され本文にかぶってしまいレイアウトが崩れてしまいます。ちなみにレイアウトは2段組です。

#menu{ text-align: left; width: 175px; float: left }
#menu #text ul{ list-style-type: none; margin: 0; padding: 0; border-top: 1px solid white }
#menu #text li{ background-image: url("../navi_yajirusi.gif"); background-repeat: no-repeat; background-position: left center; margin: 0; padding: 0; border-bottom: 1px solid white }
#menu #text li a{ color: #fff; text-decoration: none; background-color: #1b328d; background-image: url("../navi_yajirusi.gif"); background-repeat: no-repeat; background-position: left center; display: block; padding: 10px 0 10px 10px; width: 175px }
#menu #text li a:hover { color: #fff; background-color: #ff0; background-image: url("../navi_yajirusi.gif"); background-repeat: no-repeat; background-position: left center }

どなたか詳しい方よろしくお願いいたします。
困り度：
  • すぐに回答を！
質問投稿日時：
08/05/05 13:02

回答
ANo.1 原因は、DOCTYPE宣言が入っていないため、
IEでスタイルがうまく効いていないことと、
「#menu #text li a」の値の
「padding: 10px 0 10px 10px; width: 175px」部分の計算が、
あっていないことが考えられます。
（padding:10px;width155px）でulの175pxとぴったりになります。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "​http://www.w3.org/TR/html4/loose.dtd">​
回答者：kuzumiHK
種類：アドバイス
どんな人：専門家
自信：参考意見
回答日時：
08/05/05 15:18
この回答への補足この回答に補足をつける(質問者のみ)
この回答へのお礼この回答にお礼をつける(質問者のみ)
 
このページのトップへ