DIV定位

Question

嘿，这是我的链接：http://ilikeyou.tk/409/

我正在尝试将Next和Previous按钮（＆lt;和＆gt;）放在容器like_box_page内。

我首先使用这里的答案对齐按钮：Vertical-Align a DIV

无论我做什么，按钮仍然不合适。 有没有办法将它们水平放在容器中？

Answer 1

为firefox使用firebug插件，你会发现它们非常位于你的盒子的中心，剩下的就是关闭：D他也比它的父母大得多。

Answer 2

我会更改事件HTML结构，但是如果要使用此HTML ---

覆盖这3个类：

.img_spot {
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    float: left;
    margin-left: 0 !important;
    margin-right: 20px;
    max-width: 333px;
}

.navigation {        
    height: auto;
    left: -5px;
    margin: 30px 0;
    padding: 0;
    position: absolute;
    width: 636px;
}

.like_box_page {
    background: none repeat scroll 0 0 #F8F8F8;
    border: 1px solid #E4E3E3;
    box-shadow: 0 3px 0 #E9E9E9 inset;
    float: left;
    padding: 16px 61px 13px;
    position: relative;
}

Answer 3

您是否尝试过使用绝对定位？将父div设置为postion:relative以及指向position:absolute的链接并设置top属性。这可能不完美，但我认为它会起作用。

Answer 4

在.navigation中，您需要更改margin，如下所示

.navigation {
    position: absolute;
    margin: 0 0 0 -20px;  //HERE
    top: 50%;
    height: 50px;
    width: 100%;
    z-index: 1;
}

您可能还希望在img下再提供margin。

<img style="margin-left:40px;"

Answer 5

在.navigation中添加margin-top: -25px;，将导航置于高度中间，而不是从中心开始。

P.S。 margin-top：-25px或（yourCOntainerHeight）/ 2作为负边距，因为你有顶部：50％意味着你的元素将从容器高度的50％开始，你必须补偿负边距在中间的exatcly。 / p>

此致

Answer 6

在您之前的css代码中，只需替换margin-left：10px;保证金左：200px;
和保证金：10px;保证金权利：200px;