Question

页： http://www.serrupro.ca/index.php?option=com_content&view=article&id=5&Itemid=6&lang=fr

相同页面但链接到锚点 http://www.serrupro.ca/index.php?option=com_content&view=article&id=5&Itemid=6&lang=fr#opportunites

我的左右两侧向上移动。

所以我使用-4000边距和4000填充方法，这样无论右边多长/短，我的左侧都有一个白色背景一直到底部。

这个左侧和右侧是溢出的容器：隐藏;

这是我能看到的唯一能让这些元素消失的东西。没有它我的页面无法正常工作。

我该怎么做才能解决这个问题？似乎不是锚的正常行为。

感谢您的帮助

#topcontent {
    position:relative; /* required for ie or 4000px padding/margin visible */
    background-color: #231f20;
    border-left: 1px solid #231f20;
    border-right: 1px solid #231f20;
    overflow:hidden;
}
#topcontent .left {
    position:relative;
    width:703px;
    margin-bottom:-4000px;
    padding-bottom:4000px;
    background:#FFF;
}
#topcontent .right {
    width: 245px;
    float: right;
    margin-bottom:-4000px;
    padding-bottom:4000px;
}

Answer 1

呃，好吧我没有给你一个答案 - 我倾向于使用背景图像方法设计我的柱状布局，或者使用相同颜色的侧边栏。但是我确实找到了一些关于这个特殊“bug”的文档：

http://www.positioniseverything.net/articles/onetruelayout/appendix/equalheightproblems

老实说，我不知道除了javascript解决方案之外的另一种替代方法，我总是试图避开它。您必须对背景图像进行一些严肃的设计重构才能成为一种选择。

祝你好运，我希望链接有所帮助 - 他们有一些解决方法

Answer 2

最快的解决方案是给溢出：隐藏元素填充底部。在你的情况下它将是

#topcontent { /* Any element with overflow: hidden property */
    padding-bottom: 18px; /* Value in px that will work for you */
}

CSS溢出：隐藏在页面中的锚点

2 个答案: