ログイン
質問する
Gizport
Solid 111の使い方、故障・トラブル対処法
1 回答
0
Share (facebook)
211
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!知恵袋 4961日前
コメントする
お気に入り
1
質問者が選んだベストソリューション
>tokoro_joji_san_san_sanさん

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

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

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

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

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

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