css - CSS - position: absolute を使用せずに div を画面の下部に揃えます

Question

私は PhoneJS アプリを設計しています。画面の下部にボタンを配置する必要がありますが、position: absolute.

絶対を使用しないのはなぜですか？

これは PhoneJS アプリケーションであるため、電話を横向きにすると問題が発生します (以下を参照)。

これは縦向きです (ボタンは正しく配置されています)

これは横向きです (ボタンの位置がずれています)

position: absolutecss 属性を使用せずにそのようなタスクを達成するにはどうすればよいでしょうか?

Answer 1

に関係なく、2 つのボタンとスペースがないという問題が引き続き発生しますposition: absolute。

メディア クエリを使用して風景をターゲットにし、スタイルを変更することをお勧めします。

/* iPhone Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {

  /* Styles go here */

}

CSS トリックのメディア クエリ

Answer 2

このコードでは、css に @media タグを使用してみてください。