前提・実現したいこと
ulタグの枠の左側の余白を統一したい。
liタグの行間を揃えたい。
発生している問題・エラーメッセージ
下図のように「メリット」下の枠と「デメリット」下の枠の左側が揃っていません。
また、箇条書きの行間も「メリット」と「デメリット」で違います。
ulのスタイルシートは「メリット」も「デメリット」も同じ内容を使用しているので原因が分かりません。
spanタグが影響しているのかと思ってpタグに変えてみたりしたのですが、変化はありませんでした。
どなたが修正方法が分かれば、ご教示お願いします。
該当のソースコード
<head> <style type="text/css"> span.good { color: green; font-weight: bold; font-size: large; } span.bad { color: red; font-weight: bold; font-size: large; } ul { margin: auto; border: 5px double #333333; border-radius: 15px; display:inline-block; padding: 20px; } </style> <div> <p>◯◯</p> <span class="good">メリット</span><br> <ul> <li>◯◯</li> <li>◯◯</li> </ul><br><br> <span class="bad">デメリット</span><br> <ul> <li>◯◯</li> <li>◯◯</li> <li>◯◯</li> <li>◯◯</li> </ul><br> <p>◯◯◯◯◯◯◯◯◯◯◯◯◯◯◯◯◯◯◯◯</p> </div>
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/03/30 09:02