※ ChatGPTを利用し、要約された質問です(原文:リストを全体的に右寄せにしたい。)
このQ&Aのポイント
リストを全体的に右寄せにするには、リストを包む大きな<div>タグにtext-alignプロパティを使ってrightを指定します。
<div>タグに対してwidth: 100%を指定し、background-colorプロパティで背景色を設定します。
リストの<li>タグに対してfloat: rightを指定し、positionプロパティを使って右寄せにします。
リストを横並びにしました。
これを大きいdivで囲んだ中の右寄せにするにはどうしたらよいのでしょうか。
#ex {
width: 100%;
background-color: #66CCFF;
height: 28px;
}
#ex ul {
list-style: none;
}
#ex li {
margin: 0px;
padding: 5px 0px 5px 30px;
list-style: none;
float: left;
background: url(***.gif) no-repeat 10px 0.5em;
}
<div id="ex">
<ul>
<li><a href="#">リスト</a></li>
<li><a href="#">リスト</a></li>
</ul>
</div>
お礼
#ex li のfloat: left;をやめて、display:inlineに変更し、yambejpさんの方法で解決しました。 ありがとうございました!!
補足
ご回答、ありがとうございます。 floatを設定の場合、#ex ulにwidthは指定しなくてもOKでしょうか?