CSS定位问题

好吧，我目前在这个网站上工作，http://www.katiesamsonlaxfest.com/preview.html。我想在页面的左下角添加一些联系信息（位于内容区域下方，位于背景的页脚导航左侧）。我也希望能够保持页脚导航居中。有什么建议么？CSS定位问题

来源

2010-02-02 Dan

我可能没有正确理解，但是您的请求有点矛盾：在nav左侧添加信息会偏移导航，不再使其居中。 – sthg 2010-02-02 02:26:16

这就是要点，我需要一个解决方法。我希望联系信息在Nav保持居中时左侧浮动，我需要一个解决方案 – Dan 2010-02-02 02:27:41

最简单的方法，给你的布局，可能是定位的东西与相对定位。 IE浏览器 - 在你的页脚div中，指定2个div。使一个20％ish宽度，第二个80％ish宽。将当前页脚放入div 2中，左对齐文本，然后调整百分比，直到所有内容都很好地排列。

来源

2010-02-02 02:34:12 Quotidian

是的，我会看到如果这样做的工作，鉴于那里的情况可能没有围绕几个div的方式 – Dan 2010-02-02 02:38:12

试试这个：

<div id="footer"> 
    <div id="left_footer"> 
    some content 
    </div> 
    <ul> 
     <li><a href="http://www.katiesamsonlaxfest.com/index.html">Home</a></li> 
     <li><a href="">The Event</a></li> 
     <li><a href="http://www.katiesamsonlaxfest.com/design.html"> The Cause </a></li> 
     <li><a href=""> The Teams </a></li> 
     <li><a href=""> To Donate </a></li> 
     <li><a href=""> The Sponsors </a></li> 
</ul> 
<p> Copyright 2010, The Katie Samson Foundation</p> 
</div>

我页脚设置相对定位，然后将新添加的格，left_footer，被定位绝对，左0像素，以及顶部的几个像素下来。

#footer 
{ 
    position: relative; 
} 
#left_footer 
{ 
    position: absolute; 
    left: 0px; 
    top: 28px; 
}

在Firefox和IE8中看起来没问题。

来源

2010-02-02 02:40:28 wsanville

这是我刚刚想出了利用JSBin：http://jsbin.com/exogi/edit

似乎做你想要什么，花车，并不会改变你的页脚文本的中心。重要的是要注意的是，#footer上的边距为0（上/下）（可更改），左右等于宽度#contact-info。在大多数浏览器（我认为IE6 & 7不喜欢），它应该工作得很好。

来源

2010-02-02 02:42:13

回答

相关问题