在第三个容器div内水平对齐2个div [英] align 2 divs horizontally inside a third container div

问题描述

我有以下代码：

<div id="container">
    <div id="div1">Div 1</div>
    <div id="div2">Div 2</div>
</div>

我想在容器中可以有＃box1和＃box2。容器在中心

I want to be able to have #box1 and #box2 one next to the other inside the container. Container is centered

推荐答案

这将使容器居中，并使两个div居中，同时将样式与实际内容：

This will center the container, and have the two divs within it centered, while separating the styles from the actual content:

HTML：

<div id="container">
    <div>Div 1</div>
    <div>Div 2</div>
</div>

CSS：

#container > div
{
    display: inline-block;
    border: solid 1px #000;
}
#container
{
    border: solid 1px #ff0000;
    text-align: center;
    margin: 0px auto;
    width: 40%;
}   

工作实例：

http://jsfiddle.net/JLjjK/

这篇关于在第三个容器div内水平对齐2个div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！