固定页脚和短屏幕

你有任何建议如何使固定定位页脚在短屏幕/低分辨率上工作？固定页脚和短屏幕

我有页脚：

#footer {position: fixed; bottom: 0; width: 100%; height: 35px; background: rgba(0, 0, 0, 0.3); line-height: 35px; color: #fff; font-size: 14px; text-transform: uppercase}

工作于大部分的决议很好，但是当屏幕高度较小然后900px，因为它固定它重叠的内容。你如何解决这些问题？我正在考虑用js检查屏幕分辨率，然后而不是固定给它的位置：相对。你怎么看？

来源

2013-10-03 dease

CSS媒体查询 – MLeFevre

@dease检查回答以下 –

它是否真的需要修复？在几个浏览器中，支持仍然有点草率...如果它绝对定位，您可以在主内容中添加填充，以便页脚不会重叠内容。

无论如何，你试图做的事情可以很容易地用CSS媒体查询来完成。你可以从这里开始：http://css-tricks.com/css-media-queries/

来源

2013-10-03 08:51:00 MrMerrick

给出Z-index = 10; （一些较高的Z-index使其脱颖而出）

来源

2013-10-03 08:50:11

但随后它会站出来过的内容，我想实现的是检测短屏幕，然后以某种方式移动内容。 – dease

你可以试试这个 CSS：

html,body{position:relative; margin:0; padding:0; height:100%} 

.footer{ position:fixed; height:30px; background-color:grey; width:100%; bottom:0px; z-index:999}

来源

2013-10-03 09:57:45

固定页脚和短屏幕

回答

相关问题