Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas

Porque imagens não alinham com o titulo e "class menu" não alinha e o "text decoration none"não funciona

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Pedro e os Dinos</title>
        <link rel="stylesheet" href="reset.css">
        <link rel="stylesheet" href="index.css">
    </head>
    <body>
        <header>
            <div class="cabecalho">
                <h1> Pedro e os Dinos</h1>
                <a href="index.html"><img id="img1" src="dino1.png">
                <a href="index.html"><img id="img2" src="dino2.png">    
            </div>
        </header>

        <div class="menu">
            <ul>
                <li><a href="dinos.html">Dinos</li>
                <li><a href="eras.html">Eras</li>
            </ul>
        </div>

    </body>
</html>
body{
    background-color: #59b300;
}

.cabecalho{
    color: #FFFFFF;
    font-size: 120px;
    font-family: Bahnschrift Condensed;
    text-align: center;
    text-transform: uppercase;
    padding: 20px;
}
#img1{
    display: inline-block;
    vertical-align: top;
    height: 250px;
      width: 250px;
      float: right;

    }
#img2{
    display: inline-block;
    vertical-align: top;
    height: 250px;
      width: 250px;
       float: left;
      }
.menu{
      color: #FFFFFF;
    font-size: 80px;
    font-family: Bahnschrift Condensed;
    text-align: center;
    text-transform: uppercase;
    padding: 20px;
    text-decoration: none;
}
ul {
    display: inline-block;
    vertical-align: top;
    width: 50%;
    text-decoration: none;
}
5 respostas
body{
    background-color: #59b300;
}

.cabecalho{
    color: #FFFFFF;
    font-size: 120px;
    font-family: Bahnschrift Condensed;
    text-align: center;
    text-transform: uppercase;
    padding: 20px;
}
#img1{
    display: inline-block;
    vertical-align: top;
    height: 250px;
      width: 250px;
      float: right;

    }
#img2{
    display: inline-block;
    vertical-align: top;
    height: 250px;
      width: 250px;
       float: left;
      }
.menu{
      color: #FFFFFF;
    font-size: 80px;
    font-family: Bahnschrift Condensed;
    text-align: center;
    text-transform: uppercase;
    padding: 20px;
    text-decoration: none;
}
ul {
    display: inline-block;
    vertical-align: top;
    width: 50%;
    text-decoration: none;
}insira seu código aqui

Fala ai Gustavo, tudo bem? Acho que faltou fechar os links do header, seu código:

<a href="index.html"><img id="img1" src="dino1.png">
<a href="index.html"><img id="img2" src="dino2.png">  

Tente assim:

<a href="index.html"><img id="img1" src="dino1.png"></a>
<a href="index.html"><img id="img2" src="dino2.png"></a>

Espero ter ajudado.

Faltou mesmo, obrigado Matheus. Porém os pontos que levantei não resolveram...

solução!

Consegui resolver usando "position".

Boa Gustavo, sempre que precisar não deixe de criar suas dúvidas.

Abraços e bons estudos.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software