Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Tag <A> Alura Flix

Olá, tudo bem? Gente eu comece a simular aqui o alura Flix sem ajuda do curso por mim mesmo, para depois seguir o curso, mas estou enfrentando uma seria dificuldade em mexer a tag < a> dentro de uma div... Insira aqui a descrição dessa imagem para ajudar na acessibilidadeComo podem ver essa tag está dentro de uma div, mas ela não respeita as regras do margin-top... Apenas o do padding, mas como o padding acaba por si so expandindo demais não queria utilizar ele... O codigo está a baixo.

<!DOCTYPE html>

Com o combo+ Você pode aproveitar a Alura+ e o Alura lingua por um preçoúnico

                <div class="box a">
                    <a href="#" class="teste">Assine por 12x de RS 120,00*</a>
                </div>
                <div class="boxb">
                    <a href="#">Assinar somente o Alura+</a>
                </div>
                <p> O preço pode variar caso a asinnatura seja feita e outros planos.</p>
            </div>
        </div>
    </header>

    <section class="seu-jeito">>

    <section>


</body>
    * {
margin: 0px;
padding: 0px;

}

body{ background-color: #00030c; }

header{ width: 1440px; height: 800px; margin: 0 auto; color:white; background-image: url("../IMG/Background.png"); background-repeat: no-repeat; border: 4px solid red;

}

.box-informacao{ width: 600px; height: 580px; position: relative; margin-left: 5%; text-align: center; box-sizing: border-box; } .box-informacao-title h1{ font-size: 28px; text-align: center; margin-top: 130px; margin-bottom: 20px; }

.box{ width: 512px; height: 56px; background-color: #167BF7; margin: 10px auto; cursor:pointer; border-radius: 5px; } .box:hover{ background-color: #0073ff; width: 550px; height: 65px;

} .teste { margin-top: 50px; } .box a, .boxb a { text-decoration: none; color: white; top: 50px; top: 15px; font-size: 20px; } .box-informacao-title p{ color:#C0C0C0; } .boxb{ width: 512px; height: 56px; border: 1px solid #ffffff; margin: 10px auto; cursor:pointer; border-radius: 5px; } /* Header **/

.seu-jeito{ width: 1440px; height: 1000px; border: 4px solid white; margin: 60px auto; }

1 resposta
solução!

A maneira que eu tinha fiiz foi um pouco quanto "errada" vamos dizer rsrs. Mas para alinhar eu mandei um position relative no A. E alinhei na brutaliidade de colocar uma margin.