将div放在div中

时间:2012-03-19 11:00:08

标签: html css

我知道这应该是一件相当容易的事,但出于某种原因,我遇到了问题并且不确定原因。我在画廊下面添加了一个控制器,您可以使用该控制器滚动幻灯片,并将其置于中心位置。

这就是代码看起来像ATM:

<div class="control_wrap" style="">
    <div class="gallery_controls" style="">
       <a target="_blank"></a> <a target="_blank"></a> <a target="_blank"></a>
    </div>
</div>

CSS

.control_wrap{
    float:left;
    width:100%;
}

.gallery_controls{
    margin:0 auto;
    float:left;
    width:50%;
}

如果您需要更多信息,请与我们联系。

感谢。

6 个答案:

答案 0 :(得分:0)

你必须摆脱浮动:留在.gallery_controls。保证金:0自动不起作用。

答案 1 :(得分:0)

为了使margin:0 auto;起作用,你必须在该div上指定一个宽度并省略浮动。

如果您还希望垂直居中div,则需要在div上使用position:absolute,或在父{div} display:table-cell上使用vertical-align:middle

这样的事情:

parent{
   position:relative;
}

child{
   position:absolute;
   top:50%;
   left:50%;
   width: <your-width>;
   height: <your-height>;
   margin-left: <your-width> / 2;
   margin-top: <your-height> / 2;
}

Example fiddle

答案 2 :(得分:0)

尝试从此类中删除浮动:

.gallery_controls{

margin:0 auto;
/*float:left;*/
width:50%;

}

答案 3 :(得分:0)

将您的CSS更改为以下内容:

.control_wrap {
    float:left;
    width:100%;
}
.gallery_controls {
    margin:0 auto;
    float: left;
    text-align:center;
    width:50%;
}​

结果http://jsfiddle.net/AmAMP/1/

答案 4 :(得分:0)

我已更新,请参阅 CSS ,请查看: -

.gallery_controls{
    margin:0 auto;
    width:50%;
    height:50px;
    background:red;
}

或者您可以看到实时示例以便于理解: - http://jsfiddle.net/cPk53/5/

答案 5 :(得分:-1)

改用表格。使用div,浏览器的外观和感觉会有所不同。当你觉得你已经完成它的那一刻,加载到另一个浏览器或旧版本的浏览器将打破你的错觉。