ＣＳＳでulとliを指定し横に並べたいです。

質問

ulとliを使っても横に表示できる方法わかる方教えてください。

例
<ul>
<li>あああ</li>
<li>いいい</li>
<li>ううう</li>
<li>えええ</li>
</ul>
普通は
・あああ
・いいい
・ううう
・えええ
となってしまいますがこんな感じで作りたいのですが。

・あああ　　・いいい　　　・ううう　　　・えええ

みたいに横にしたのですがどうやってやればいいかわかりません（泣）
たぶんＣＳＳで指定するのかと思ってますが、違うんでしたらそのやり方を教えてください。

回答No.2

n4416 · ベストアンサー

li {
display:inline;
}

で出来ます。ただ、この方法ではリストマークが表示されなくなりますので、
背景画像で、マークをつけてやるようにすればいいと思います。

回答No.3

eg_nn

質問に書いてあるとおりに再現するとして、以下のような記述でどうでしょう。

CSS
ul.list{margin:0; padding:0;}
.list li{float:left; margin:0 20px 0 5px;}

HTML
<ul class="list">
<li>あああ</li>
<li>いいい</li>
<li>ううう</li>
</ul>

こちらのサイトの「リストを作る(HTML,CSS一覧)」→「リストを横に並べる」がサンプルと注意事項等が書いてあって参考になるのでは、と思います。
http://www.1uphp.com/

回答No.1

font_color

CSSで出来ますよ。

li{
display: inline;
}

としてみてください。