ランディングページを作っております。
改行タグを<br class="hidden-xs">として、
スマホの時だけ改行をとるというCSSを書いています。
@media only screen and (max-width: 480px) { .hidden-xs { display: none ;} }
がしかし、これでスマホの場合(480px以下)は改行がとれて表示されるはずなのですが、
改行がとれずそのまま表示されてしまいます。
【やったこと】
Googleのディベロッパーツールにてスマホの時の幅を確認したところ、
スマホの表示なのにも関わらずPCと同じピクセル幅の表示になっていました。
一方でスマホの時にちゃんと改行が取れるレターはディベロッパーツールで見たときの幅が
384pxとスマホの幅で表示されていました。
おそらく上記が原因かと思われるのですが、どのように記述すれば解決できるのか悩んでおります。
もしご存知な方がいらっしゃればご教示いただけますとありがたいです。
質問文に書かれている問題については解決していますので、いったん「解決済」にされてはいかがでしょうか。また、新たに出た問題はHTML/CSSが提示されない限り的確な解答は出来ないと思います。
回答3件
あなたの回答
tips
プレビュー