How i can center my div content with css?

Question

Actually im creating a form with this 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>

and this 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;
}

The div FormPart1 contains two divs:

FormPart1 and FormPart2. For any problem, the content is not in the center. Im trying using margin-left:auto and margin-right:auto, but i can't do it. Someone have any idea?

Answer 1

If it's only text and/or buttons.

Use:

text-align: center;

Please try to make a live 'code snippet' its easier for other developers to edit quickly your code and see if it works.

Answer 2

To center your parent div need set the width after that add in 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