質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

1回答

505閲覧

display: flexで指定したのですが横並びにならないです

korosuke3

総合スコア13

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2019/03/07 01:12

前提・実現したいこと

liに記載した数字を横並びにしたいです。

発生している問題・エラーメッセージ

縦並びのままです。

該当のソースコード

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Advanced-tec co.</title> <style type="text/css"> body { margin: 0px; padding: 0px; background-color: #ff4500; } ul { display: flex; width: 100%; margin: 50px auto; padding: 0; background-color: #ff4500; border: 1px solid #ff4500; } li{ width: 8%; padding: 40px 0; text-align: center; background-color: #ff4500; border: 1px solid #000000; color: #000000; list-style: none; } </style> </head> <body> <img src="img/haikei.jpg" alt="背景" /> <ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> </ul> </body> </html>

試したこと

本やネットで調べました。

補足情報(FW/ツールのバージョンなど)

Dreamweaverを使っています。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

yoshinavi

2019/03/07 01:15

HTML・CSSの各コードはそれぞれをコードブロックにすると、検証しやすくなり、回答もつきやすくなるかと思います。
yoshinavi

2019/03/07 01:18

>liに記載した数字を横並びにしたいです。 → 提示のコードでは横並びになっています。
Lhankor_Mhy

2019/03/07 01:21 編集

ご提示のコードを試しましたが、当方の環境では横並びになり、「横並びにならない」という問題は発生しませんでした。 ご提示いただいていない部分のコードに原因があると思いますので、質問者が動かして実際に問題が再現するコードをご提示ください。また、コードは ```css body{} ``` ```html <body> ``` のように、Markdownを使って書いてください。
azuapricot

2019/03/07 01:21

横並びになるのでキャッシュクリアしてみてください。 それでも横並びにはなりませんか? キャッシュクリア方法:F12を押してデベロッパーツールを開く→更新ボタン右クリック→キャッシュの消去とハードの再読込
korosuke3

2019/03/07 01:24

早速のコメントまことにありがとうございます! 今までDreamweaverで表示確認していたのですが、教えて頂いたとおりブラウザ上にindex.htmlをドラッグしたところ正しく表示されました。 ありがとうございました!!
yoshinavi

2019/03/07 01:59

解決されたのであれば、自己回答も「投稿」「ベストアンサーに選ぶ」ことも出来ますので、解決に至った経緯を回答として投稿し、ベストアンサーに選び、質問を「解決済」にしてください。
guest

回答1

0

ベストアンサー

自分の環境だと横並びになってますね。
キャッシュは消してみましたか?
イメージ説明

投稿2019/03/07 04:14

sauzar18

総合スコア163

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

korosuke3

2019/03/07 05:07

皆様ありがとうございました! 不慣れで申し訳ございません。 解決とさせていただきます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問