0

初めて質問させていただきます。
コーディングの勉強をしています。まだ2か月ちょっとしか勉強もしておらず、見当違いな質問になってしまうかもしれませんが教えていただけると嬉しいです。

リキッドレイアウトを作成中です。これまでvwで作成していましたが初めてremでのコーディングにトライしています。htmlで以下のコードを指定していれば、vw使用時と同じように画面横幅が半分になればremで指定した数値のものpadding,font-size,widthなども半分になるという理解だったのですが、横幅を変更するとレイアウトがめちゃくちゃになってしまいます。もし理解が間違っていたり、「リキッドレイアウト作成時にこういう間違いしてませんか?」など何かアドバイスあれば頂けると嬉しいです。

rem, リキッドレイアウトなどで検索をかけ、インターネット記事を読んだりyoutubeも見たりもしましたが、どれも「viewpointやメディアクエリ」については詳しく教えてくれるのですが、横幅が中途半端なサイズになったときのレイアウト崩れについては情報がありません。

どうぞよろしくお願いいたします。

html {
  //768p以上はpcリキッドレイアウト
  font-size: 1vw;
  font-size: 62.5%;
}

@media screen and (max-width: 767px) {
  html {
    font-size: calc(10 / 375 * 100vw);
  }
}

1 件の回答 1

1

横幅が変更されるとレイアウトが崩れる原因は、おそらく他のスタイルに関連しています。横幅を変更することで、"width" や "padding" の値が相対的に変化し、それがレイアウトに影響を与えている可能性があります。

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。