隣り合って浮かんでいる div が 2 つあります。縦向きモードでは幅が 100 ピクセル、横向きモードでは幅が 200 ピクセルになるようにしたいのですが、これは実際にモバイル デバイスで表示したときに発生します。
したがって、div は横向きモードでは拡大し、縦向きモードでは少し縮小します。
何か案は？
ベストアンサー1
これは CSS2 では不可能ですが、Javascript を使用すれば必要なこと (画面サイズの読み取りなど) を実行できます。
あなたがどのような技術を検討しているのか分かりませんが、CSS3はまさにあなたが望むものを提供します。CSS3 メディアクエリ。
CSS3 を使用すると、次のような楽しい機能を使用できます (または、幅を 200 px などと指定することもできます)。
/* Portrait */
@media screen and (orientation:portrait) {
/* Portrait styles here */
}
/* Landscape */
@media screen and (orientation:landscape) {
/* Landscape styles here */
}
チェックアウトこのサンプルページ詳しい説明については、これです。
編集今日このページを見つけたので:ハードブロイルド CSS3 メディアクエリ- 非常に良い記事です。