Q&A
ご提示のコードを試してみましたが、aaaaaaaaaa と横並びになりました。
つまり、問題が再現しませんでした。
前提・実現したいこと
ホームページビルダー22を利用してHPを作成しています。
flexboxを利用したレイアウトを作りたいと思いコードを書いたのですが、横並びにならずに困っています。
最終的には画像と文字を横並びに表示させたいと思っているのですが、前段階のテキストさえも横並びにできていないので、解決方法を教えていただけるとうれしいです。
該当のソースコード
HTML
1<!doctype html> 2<html> 3 <head> 4<meta charset="UTF-8"> 5<meta name="GENERATOR" content="JustSystems Homepage Builder Version 22.0.1.0 for Windows"> 6<link rel="stylesheet" href="CSS/common.css"> 7 <title></title> 8</head> 9 <body> 10 11 <div class="box"> 12 <div>aaaaa</div> 13 <div>aaaaa</div> 14 </div> 15 16 <div class ="test"> 17 <div> テキスト </div> 18 </div> 19 20 </body> 21</html>
CSS
1.slider { 2 position: relative; 3 width: 800px; 4 margin: 0 auto; 5} 6 7.box { 8 display: flex; 9} 10 11.test { 12color: #ff0000; 13}
「.slider」はほかのページで使用しているものです。
実装したいページでできなかったので、テスト用のページを作ってみたのですが、こちらでもできませんでした。
試したこと
テスト用の文字を赤くする装飾はうまく適用されていたので、cssは読み込めているのだと思います。
HTMLの
HTML
1 <div class="box"> 2 <div>aaaaa</div> 3 <div>aaaaa</div> 4 </div>
の部分を
HTML
1<ul> 2<li>テキスト</li> 3<li>テキスト</li> 4<li>テキスト</li> 5<li>テキスト</li> 6</ul>
に変え、CSSを
css
1ul{ 2display:flex; 3}
にしたところ、レイアウトこそ崩れていましたが、とりあえず横並びにはなっていました。
補足情報（FW/ツールのバージョンなど）
始めての質問で至らない部分もあるかと思いますが、足りない情報等あれば教えていただければと思います。
回答1件
0
自己解決
PCの再起動で解決しました。
投稿2021/11/08 07:05
総合スコア0
キャッシュのような気がするのでPC再起動までしなくても良い気もします。
あなたの回答
tips
プレビュー
