estou fazendo um tipo de portifolio com a mesma base que é ensinada no curso, mas por algum motivo nao consigo colocar as imagens em inline-block.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sk Arquitetura</title>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Mulish:wght@300;400&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/style.css">
</head>
<body>
<header>
<div class="container">
<img src="/img/logo.jpeg"alt="Sara Kathlyn"/>
</div>
</header>
<main>
<div class="projeto">
<h1>Residência REVIT4U</h1>
<p>A Residência REVIT4U foi reproduzido ao longo dos
primeiros módulos do treinamento REVIT4U,
lecionado pelo Engenheiro Vitor Cypriano Ayres.</p>
<p>O trabalho foi totalmente desenvolvido no
ND 500, ou seja, seguindo parâmetros máximos de detalhamento e representação, tais como estudo solar, topografia, materiais e texturas, paredes com camadas, colunas estruturais, pisos e lajes com camadas,
forro e entreforro, tabica, esquadrias e rodapés.</p>
</div>
<div class="imagens">
<ul>
<li>
<img src="/img/revit4u/revit4u (1).jpeg" alt="Fachada Frontal" >
</li>
<li>
<img src="/img/revit4u/revit4u (2).jpeg" alt="">
</li>
<Li>
<img src="/img/revit4u/revit4u (3).jpeg" alt="">
</Li>
<li>
<img src="/img/revit4u/revit4u (4).jpeg" alt="">
</li>
<li>
<img src="/img/revit4u/revit4u (5).jpeg" alt="">
</li>
<li>
<img src="/img/revit4u/revit4u (6).jpeg" alt="">
</li>
<li>
<img src="/img/revit4u/revit4u (7).jpeg" alt="">
</li>
<li>
<img src="/img/revit4u/revit4u (8).jpeg" alt="">
</li>
<li>
<img src="/img/revit4u/revit4u (9).jpeg" alt="">
</li>
<li>
<img src="/img/revit4u/revit4u (10).jpeg" alt="">
</li>
<li>
<img src="/img/revit4u/revit4u (11).jpeg" alt="">
</li>
<li>
<img src="/img/revit4u/revit4u (12).jpeg" alt="">
</li>
<li>
<img src="/img/revit4u/revit4u (13).jpeg" alt="">
</li>
<li>
<img src="/img/revit4u/revit4u (14).jpeg" alt="">
</li>
<li>
<img src="/img/revit4u/revit4u (15).jpeg" alt="">
</li>
</ul>
</div>
</main>
<footer>
</footer>
</body>
</html>
:root {
--cor-primaria: #cbc0a7;
--cor-secundaria: #fff;
--cor-fonte: #000;
}
body {
background-color: var(--cor-secundaria);
border: solid 50px var(--cor-secundaria);
text-align: center;
font-family: 'mulish';
margin: 0 auto;
}
/*HEADER*/
header {
border-top: solid 70px var(--cor-primaria);
border-left: solid 70px var(--cor-primaria);
border-right: solid 70px var(--cor-primaria);
}
header .container {
background-color: var(--cor-secundaria);
margin: 0 auto;
}
header img {
width: 35%;
padding-bottom: 20px;
}
main .projeto {
padding-top: 10px;
}
.projeto h1 {
font-size: 1.5rem;
letter-spacing: 2px;
}
.projeto p {
line-height: 39px;
font-size: 1.1rem;
margin: 40px;
letter-spacing: 3px;
}
main .imagens img {
width: 40%;
}
main .imagens li {
display: inline-block;
}