0

Estava fazendo um Formulario que tem que ficar na horizontal e que os inputs dentro dele sejam responsivos. Fiz o codigo no Chrome funciona perfeitamente porem o meu problema e com o Firefox, simplesmente os inputs nao respeitao a largura e acabam saindo do form. Ja tentei de tudo mas nao obtive resultados.

.container {
    max-width: 700px;
    margin: 0 auto;
}

.fluid-form {
    position: relative;
    max-width: 250px;
    padding: 2px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background: #009EFF;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: rows;
    flex-direction: rows; }

.fluid-form > input {
    width: 100%;
    box-sizing: border-box;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex; }

e o html

<div class="container">
    <form class="fluid-form">
        <input type="email">
        <input type="text">
        <input type="submit" value="Logar">
    </form>
</div>

1 Resposta 1

0

Tente trocar o margin de "0 auto" (no caso tendo que "configurar" manualmente), ele costuma dar algumas incompatibilidades dependendo do navegador.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .