CSS-在屏幕底部对齐div,不使用位置:绝对 [英] CSS - Align div in bottom of screen without using position: absolute
本文介绍了CSS-在屏幕底部对齐div,不使用位置:绝对的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在设计一个PhoneJS应用程序,我需要在屏幕底部放置一个按钮,但不能使用position: absolute
。
为什么不只使用绝对?
由于这是PhoneJS应用程序,因此在将手机翻转到横向位置时会出现问题(请参阅下面的内容)
这是纵向(按钮放置正确)
这是横向(按钮放错地方)
不使用position: absolute
CSS属性如何完成此类任务?
推荐答案
不管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-在屏幕底部对齐div,不使用位置:绝对的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文