Adiciona os cards de imagens do meio
This commit is contained in:
parent
3c735c8032
commit
6821d9238f
@ -92,6 +92,33 @@ body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.middle-cards-wrapper {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
justify-items: center;
|
||||
gap: 40px;
|
||||
margin: 0 72px;
|
||||
|
||||
}
|
||||
|
||||
.middle-cards {
|
||||
background: #E0E0E0;
|
||||
margin-bottom: 130px;
|
||||
|
||||
}
|
||||
|
||||
.middle-card {
|
||||
max-width: 566px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.middle-card-image {
|
||||
width: 100%;
|
||||
display: block;
|
||||
|
||||
}
|
||||
|
||||
@media screen and (max-width: 414px) {
|
||||
.main-banner-desktop{
|
||||
display: none;
|
||||
|
17
index.html
17
index.html
@ -58,6 +58,23 @@
|
||||
<p class="top-card-description">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. </p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="middle-cards">
|
||||
<div class="middle-cards-wrapper">
|
||||
<div class="middle-card">
|
||||
<img class="middle-card-image" src="./assests/images/middle-card-image-01.png" alt="">
|
||||
</div>
|
||||
|
||||
<div class="middle-card">
|
||||
<img class="middle-card-image" src="./assests/images/middle-card-image-02.png" alt="">
|
||||
</div>
|
||||
|
||||
<div class="middle-card">
|
||||
<img class="middle-card-image" src="./assests/images/middle-card-image-03.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
||||
<footer></footer>
|
||||
|
Loading…
Reference in New Issue
Block a user