Q&A
CSS float clearについて
HTML,CSSについて勉強し始めた者です。
画像が左側、文字が画像の右側、リンクを貼ったボタンが画像の下に来て欲しいです。
↓理想
そのため、以下のようなコードを書きましたが、ボタンも画像の右側に来てしまいます。
※関係のありそうなところだけ抜粋して載せています。
html
1<body> 2 <h1>タイトル</h1> 3 <img src="img/***.JPG" alt="" width="300"> 4 <h2>サブタイトル</h2> 5 <p>あああああああ</p> 6 <p>いいいいいいい</p> 7 <a href="https://www. ~">ボタン</a> 8</body>
css
1img{ 2 float:left; 3} 4 5a{ 6 clear: both; 7 }
imgタグをfloat:leftで指定して、aタグだけclearでfloatを解除したいのですが、依然ボタンも画像の右側にあります。
↓現状
どなたかご教授お願い致します。
回答1件
0
ベストアンサー
a要素はインライン要素のためです。
http://www.htmq.com/htmlkihon/005.shtml
CSS
1a{ 2 display: block; 3 clear: both; 4 }
とするか、そもそものaタグをdivなどで囲い、そのdivにclearを当てれば要件は達成できると思います。
投稿2018/09/22 14:19
総合スコア2534
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/09/22 15:02