Question

实际上我正在用这个HTML创建一个表单：

<div id="AdvanceSearch">

    <div id="FormPart1">

        <form class="form-horizontal" role="form">

            <div class="form-group">

                <label class="col-lg-2 control-label"> <a class="FontStyle">Palabras clave</a> </label>
                <div class="col-lg-10">
                    <input type="text" class="form-control" id="InputWord" placeholder="sofrito">
                </div>

            </div>

        </form>


        <form class="form-horizontal" role="form">
            <div class="form-group">
                <label class="col-lg-2 control-label"> <a class="FontStyle">Ingredientes</a> </label>
                <div class="col-lg-10">
                    <input type="text" class="form-control" id="InputWord2" placeholder="tomate, cebolla, zanahoria...">
                </div>
            </div>
        </form>
    </div>

和这个CSS：

#AdvanceSearch{
    background-color:#9CDEC6;
    height: auto;
    width: 100%;
    display: none;
    padding-top: 30px;
    border-radius: 0px 0px 60px 60px;
}

#FormPart1{
    margin: -9px auto;
    width: 100%;
    height: 100px;
}
#FormPart2{
    display: inline;
    box-sizing: border-box;
}

div FormPart1包含两个div：

FormPart1和FormPart2。对于任何问题，内容不在中心。我尝试使用margin-left：auto和margin-right：auto，但我无法做到。有人有什么想法吗？

Answer 1

如果它只是文字和/或按钮。

使用：

text-align: center;

请尝试制作直播的代码段＆＃39;其他开发人员可以更轻松地快速编辑代码并查看代码是否有效。

Answer 2

要使父div居中，需要在添加margin之后设置宽度：0 auto

CSS

/* TO MAKE CENTER YOUR CHILD ELEMENT. YOU NEED TO SET WIDTH YOUR PARENT DIV AND THEN
WRITE MARGIN: 0 AUTO; */

#AdvanceSearch {
  width:100px;
  margin: 0 auto;
}

DEMO

我如何用css中心我的div内容？

2 个答案: