I need to center two divs on a main html as the divs are "formRight and formLeft"

Question

I need to center two divs on a main html as the divs are "formRight and formLeft"

Navigation

#1 by (0 votes)

-3

<section id="container">
    <div id="topo">
        <img id="logo" src="_imagens/logo.png" />
    </div>
    <div id="formLeft">
        <form action="" method="post" name="form" id="form">
            <h4 id="cd1">Já sou cadastrado</h4>
            <label id="letra" class="letras">Eu sou:</label>
            <select class="letras" name="verificar">
                <option value="admin">Administrador</option>
                <option value="func">Funcionario</option>
                <option value="user">Usuario</option>
            </select>
            <br>
            <label class="letras">Login:</label>
            <input required="true" id="cadastro" name="Login" type="text" placeholder="Login" value="" spellcheck="false" class="">
            <br>
            <label class="letras">Senha:</label>
            <input required="true" id="password" name="Password" type="password" placeholder="Senha" class="">
            <br>
            <input id="logar" name="Logar" type="submit" value="Entrar">
        </form>
    </div>
    <div id="formRight">
        <form action="" method="post" name="form" id="form2">
            <h4 id="cd2">Quero me cadastrar</h4>
            <input id="cadastro" name="Cadastro" type="submit" value="Cadastrar">
        </form>
    </div>
    <div id="clear"></div>
</section>

html

asked by anonymous 22.03.2015 / 22:19

1 answer

Search between date using two columns [duplicate] Program to print an array with the same number of rows and columns with descending order [closed]

score 0 · Answer 1

You can do this in several ways, but I think the best way to resolve this in your code structure is as follows:

You can use the float property on the two divs you want to center, like this:

#formLeft, #formRight {
    float: left;
}

Taking advantage of your code, add the following in css as well:

#clear {
    clear: both;
}

This way you prevent other elements below these two divs from "floating" too.

link