サイト模写・奮闘記(インデントで思わぬ問題が・・・)

サイト模写で作った、マッサージ屋のサイトの「よくある質問」のページで、回答文の2行目以降も字下げ(インデント)になっている ←これを再現するため、以下のリンクを参考にしました。

text-indent ではなくこれでやったら、いい感じになったんだけど、その代わりに回答文の中でさらにインデントになってる箇所があり、そこが何故か2カラム構成のようになってしまい、どうやっても普通に改行・字下げができなくなった。

これは、親要素にdisplay: flex; の設定をしたのが原因みたいだ。

それと、何故か疑似要素(Aのマーク)のpadding領域がタテ長になり、丸いマークにしていたのが楕円になってしまったw これを調整するために、わざわざpadding の上下・左右を微調整したりした

最終的には、完璧には元サイトのように出来てないけどひとまず妥協できる感じにはしてあります。

コメント

タイトルとURLをコピーしました