Gizport
1 回答
0
Share (facebook)
196
view
全般

css教えてください。 111222333をセンタリングしたいのです...

css教えてください。 111222333をセンタリングしたいのですができません。どこに問題があるのですか



index.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta name="GENERATOR" content="JustSystems Homepage Builder Version 15.0.9.0 for Windows">
<title></title>
<link rel="stylesheet" href="base.css" type="text/css">
</head>
<body>
<div id="test">
<ul>
<li><a href="#">111</a>
<li><a href="#">222</a>
<li><a href="#">333</a>
</ul>
</div>
</body>
</html>





base.css

body{
width : 800px;
border-width : 1px;
border-style : solid;
border-color : gray;
margin-left : auto;
margin-right : auto;
}
ul{
padding : 0px;
margin : 0px;
}
#test{
width : 800px;
margin:0 auto;
}
#test li{
list-style-type : none;
float : left;
}
Yahoo!知恵袋 4541日前
コメントする
お気に入り
1
質問者が選んだベストソリューション
>tokoro_joji_san_san_sanさん

>111222333をセンタリングしたいのですができません。どこに問題があるのですか

divとliにborderを付けてみれば分かります。
floatは左寄せする指定なので、これの指定された要素を中央寄せはできません。
中央寄せしているように見せるにはこのfloatをつけた要素を入れたboxを中央寄せします。

中央寄せされた800pxのdiv中でliは左寄せされているはずですがどうですか。

liを中央寄せしているように見せるには、divの横幅を「liが右端で折り返さない程度の横幅」に指定すればいいです。
Yahoo!知恵袋 4540日前
シェア
 
コメントする
 

参考になったと評価
  このQ&Aは参考になりましたか?

Share (facebook)
その他の解決方法を知っていますか?
回答する
全般
67
Views
質問者が納得>tokoro_joji_san_san_sanさん >111222333をセンタリングしたいのですができません。どこに問題があるのですか divとliにborderを付けてみれば分かります。 floatは左寄せする指定なので、これの指定された要素を中央寄せはできません。 中央寄せしているように見せるにはこのfloatをつけた要素を入れたboxを中央寄せします。 中央寄せされた800pxのdiv中でliは左寄せされているはずですがどうですか。 liを中央寄せしているように見せるには、divの横...
4541日前view67
全般
72
Views
質問者が納得ulのデフォルトのスタイルが原因です。 #test自体は関係ありません。#testが40pxずれているのではなく、#testの中のulがずれているんです。 ulはpadding-left:40px(ブラウザによってはmargin)がデフォルトで設定されているのでそれをリセットしないといけません。 #test ul{ margin:0; padding-left:0; } とすればulの余白(左側と上)は無くなります。 参考: UIのデフォルトスタイルシートの初期化方法 の ulの部分 http://w...
4542日前view72