affonso_kopmann/challenge-landing-page-affonso-kopmann
1
0
Fork 0
forked from M3-Academy/challenge-landing-page
Code Issues Pull Requests Packages Projects Releases Wiki Activity

hotfix: Corrige class fig-container desktop

Browse Source
This commit is contained in:
Affonso Kopmann 2022-10-11 19:21:41 -03:00
parent e1ffede000
commit 4470232f6f
2 changed files with 30 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
_assets/css/main.css
View File

@ -95,25 +95,29 @@ body {
margin-top: 27px; margin-top: 27px;
} }
.imageblock-wrapper { .fig-container {
border: #00c8ff 1px solid; background-color: #00c8ff;
background-color: #e0e0e0; display: block;
display: grid; margin: auto;
grid-template-columns: repeat(3, max-content);
gap: 39px;
justify-content: center;
} }
.imageblock-image { .fig-wrapper {
border: #00c8ff 1px solid;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
bottom: -62px;
} }
.fig-image {
width: 29%;
}
.cards-wrapper2 { .cards-wrapper2 {
display: grid; display: grid;
grid-template-columns: repeat(4, max-content); grid-template-columns: repeat(4, max-content);

23
index.html
View File

@ -103,21 +103,20 @@
</figure> </figure>
</div> </div>
<!-- Imageblock | Desktop and Mobile -->
<div class="imageblock-wrapper">
<figure class="imageblock-image image1">
<img src="./_assets/images/image1.png" alt="Imagem 1" />
</figure>
<figure class="imageblock-image image2"> <div class="fig-container">
<img src="./_assets/images/image2.png" alt="Imagem 2" /> <figure class="fig-wrapper">
</figure> <img class="fig-image" src="./_assets/images/image1.png" alt="Imagem 1">
<img class="fig-image" src="./_assets/images/image2.png" alt="Imagem 2">
<img class="fig-image" src="./_assets/images/image3.png" alt="Imagem 3">
</figure>
<figure class="imageblock-image image3"> </div>
<img src="./_assets/images/image3.png" alt="Imagem 3" />
</figure>
</div>
<!-- Cards2 | Desktop and Mobile --> <!-- Cards2 | Desktop and Mobile -->
<div class="cards-wrapper2"> <div class="cards-wrapper2">
<figure class="card2"> <figure class="card2">