0

我正在尝试使用页眉和页脚创建圆角。我能够强制页眉位于顶部，但我不明白为什么我不能强制页脚位于底部。

事实上，位置是绝对的；底部：0；这样做，但我的页脚仅在文本的长度中。当我添加 width:100%; 时，页脚变得比 ???

在这里你可以看到我的代码：http: //jsfiddle.net/fleduc/GN9q5/

4

6 回答 6

2

你设置left: 0，right: 0而不是width: 100%;- 见测试http://jsfiddle.net/thebabydino/GN9q5/3/

您可能还想阅读此http://www.456bereastreet.com/archive/201112/the_difference_between_widthauto_and_width100/

确实，您在这里有绝对定位，width: auto在这种情况下不会起作用，但您必须了解这width: 100%意味着容器的宽度没有填充和边框（除非您使用box-sizing: border-box）

于 2012-05-25T16:07:47.797 回答
1

您已经指定了 div 的宽度，单位为 px，那么您可以指定页脚的宽度（单位为 px）吗？示例：http: //jsfiddle.net/GN9q5/4/

于 2012-05-25T16:09:18.147 回答
1

只需更改此 css 即可使用；-) 

.rcs .ftr {                        
        margin:110px 0 0 0; 
        font-size:1.2em; 
        padding:5px 0px 5px 10px;        
        border-bottom-left-radius: 0.35em;
        border-bottom-right-radius: 0.35em;
        border-top:1px solid #AAAAAA;
    }

见测试http://jsfiddle.net/GN9q5/5/

于 2012-05-25T16:10:26.100 回答
0

绝对定位的元素不再是布局的一部分。他们不知道父元素有多大，因此您必须将宽度设置为静态值。

于 2012-05-25T15:59:02.503 回答
0

您必须设置width绝对值并计算填充。

举个例子：

If you have a width of 960px and a padding of "5px", your with must be 950px.

You SHOULD remove it for reason that I don't exactly know.
于 2012-05-25T16:03:14.220 回答
0 
/*footer*/
.rcs .ftr {                        
    margin:0; 
    font-size:1.2em; 
    padding:5px 5px 5px 10px;
    position: absolute; 
    bottom: 0px;
    width: 385px;          
  border-bottom-left-radius: 0.35em;
  border-bottom-right-radius: 0.35em;
    border-top:1px solid #AAAAAA;
}

您将容器宽度设置为 400 像素。左右填充 = 15px，所以减去它并将宽度设置为 385px。

更多信息：绝对与相对位置宽度和高度

此外，请确保关闭所有声明。

于 2012-05-25T16:08:10.543 回答