みんなの「教えて（疑問・質問）」にみんなで「答える」Q&Aコミュニティ

こんにちはゲストさん。会員登録(無料)して質問・回答してみよう！

質問する
マイページ

ログイン

<< 前の質問 | 次の質問 >>

解決済みの質問

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

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

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

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

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

投稿日時 - 2008-08-10 21:40:25

通報する

QNo.4242284

soyamosa

すぐに回答ほしいです

質問者が選んだベストアンサー

li {
display:inline;
}

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

投稿日時 - 2008-08-13 16:38:56

回答を評価する （1）
通報する

ANo.2

n4416

このQ&Aは役に立ちましたか?

はい

11人が「このQ&Aが役に立った」と投票しています

回答（3）

ANo.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/

投稿日時 - 2008-08-15 16:55:28

回答を評価する （0）
通報する

ANo.1

font_color

CSSで出来ますよ。

li{
display: inline;
}

としてみてください。

投稿日時 - 2008-08-10 21:46:26

回答を評価する （0）
通報する

あなたにオススメの質問

ページTOP