centralizar botao enviar pra versao mobile.

Olá, Francisco.

Tudo bem?

Para centralizar o botão sem precisar da <div> basta você adicionar um display: block; e um margin: 0 auto; no seu botão. Exemplo:

.enviar{
        display: block;
        margin: 0 auto;
    }

Só vai precisar definir uma largura para o botão com o width: ; que seja menor que a tela.

Espero que funcione, mas qualquer dúvida manda aqui de novo. Valeu.

entao... mas ai quando eu clico no botao ele aumenta sabe.. ai quando ele aumenta ele encosta nas laterais... eu queria por ao menos 5px nas laterais, mas os 5px so funcionam do lado direito e o lado esquerdo fica meio q fixo.

oh

agora os 5px so entra no lado esquerdo uwu

obs: a imagem a cima ja é com o botao aumentado ao clicar.

pera que agora deu certo kkkkkkkkkk

botao normal e depois botao ampliado.

eu fiz assim:

  .enviar {
        width: calc(100% - 20px);    
        display: block;
        margin: 0 10px;
    }

mas sinto q ainda nao ta certo.. pq com width cal o margin nao seria mais preciso.. porem.. se eu tirar o margin 10px fica torto.

 .enviar {
        width: calc(100% - 20px);    
        display: block;

    }

o codigo abaixo é o codigo normal sem ser o mobile(@media screen)

form {
    margin: 40px 0;
}

form label, form legend {
    display: block;
    margin: 0 0 10px;
}

.input-padrao {
    display:  block;
    margin: 0 0 20px;
    padding: 10px 25px;
    width: 50%;
}

.checkbox {
    margin: 20px 0;
}

.enviar {
    width: 40%;
    padding: 15px 0;
    background: orange;
    color: white;
    font-weight: bolder;
    font-size: 18px;
    border: none;
    border-radius: 5px;
    transition: 1s all;
    cursor: pointer;
    box-shadow: 2px 2px 5px #808080;
}

.enviar:hover {
    background: darkorange;
    transform: scale(1.05);
}

Tenta utilizar o margin: 0 auto; em cima disso que você já fez, ai se centralizar é sucesso:

.enviar {
        width: calc(100% - 20px);    
        display: block;
        margin: 0 auto;
    }