1

嗨，我有一个这样的主页。

html视图

<html>   

<head>  

</head>  

<body>  

<div class="wrapper">  

<div class="content">  

<ui:include src="/templates/include/header.xhtml"/>  

<div class="left_menu">  

<ui:include src= />  

</div>  

<div class="content_container">  

<ui:insert name="body">Body</ui:insert>  

</div>      

</div>  

<div class="footersathi">  

<ui:insert name="footer">footer</ui:insert>  

</div>  

</div>      

</body>  

</html>

html视图结束

css 

.wrapper {  
min-height:100%;
position:relative;
     }

.content {
margin:0;
padding-bottom:20px;
}

.left_menu {
position: absolute;
top: 0px;
left: 0px;
}

.content_container {
position: absolute;
top: 176px;
left: -15px;
}

.footersathi {
width:100%;
height:20px;
position:absolute;
bottom:0;
left:0;
background:blue;
}

css 结束

问题是因为 iam 使用ui:insert name=body标记 iam 包含名称正文的页面有些页面内容较少，有些页面内容较多，但页脚相对于该内容没有变化，而是固定到特定位置可能有使用 ui:insert 时可以帮助我解决此问题。

4

2 回答 2

0

为什么要position: absolute;在页脚上使用？如果您设置position: static'（如果您未指定，则为默认设置），页脚将自动出现在文档末尾。

如果这不能回答您的问题，请让您的问题更清楚:)

对于您想要的，我认为您可以避免将元素定位在正常流程之外。在此处查看示例，了解如何使用 CSS 创建布局的示例。

于 2012-05-07T07:30:26.723 回答
0

页脚之前的包装器 div 类（带有您为其提供的 css）是我认为当您希望页脚始终占据页面底部时提出的解决方案。

至于您的问题，除非指定了 float 或 inline-block ，否则 div 类默认情况下是相互重叠的。因此，如果您删除：

position:absolute;
bottom:0;
left:0;

正如 Wesley 所解释的，您的布局应该没问题。

于 2012-05-07T08:04:34.917 回答