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

feat: cards inferiores estilizados

Browse Source
This commit is contained in:
Ramon Dias Ferreira 2022-10-13 14:01:14 -03:00
parent f3d6889f3d
commit ebcff3dd0c
2 changed files with 22 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
assets/styles/landing-page.css
View File

@ -57,9 +57,12 @@ header {
width: 100%; width: 100%;
} }
.card-section{ .card-section, .card-section-small{
display: flex; display: flex;
justify-content: space-evenly; justify-content: space-evenly;
}
.card-section{
padding: 178px 0px 80px 0px; padding: 178px 0px 80px 0px;
} }
@ -103,11 +106,22 @@ header {
width: 100%; width: 100%;
} }
.card-section-small{
width: 100%;
padding-top: 190px;
}
.card-small{
width: 22%;
}
.img-card-small{
width: 24%;
}
.img-card-small img{
width: 100%;
}

10
landing-page.html
View File

@ -63,9 +63,9 @@
<img src="./assets/images/computer 3.png"/> <img src="./assets/images/computer 3.png"/>
</figure> </figure>
</section> </section>
<section> <section class="card-section-small">
<div class="card-small"> <div class="card-small">
<figure> <figure class="img-card-small">
<img src="./assets/images/money.png"> <img src="./assets/images/money.png">
</figure> </figure>
<figcaption> <figcaption>
@ -73,7 +73,7 @@
</figcaption> </figcaption>
</div> </div>
<div class="card-small"> <div class="card-small">
<figure> <figure class="img-card-small">
<img src="./assets/images/coin 1.png"> <img src="./assets/images/coin 1.png">
</figure> </figure>
<figcaption> <figcaption>
@ -81,7 +81,7 @@
</figcaption> </figcaption>
</div> </div>
<div class="card-small"> <div class="card-small">
<figure> <figure class="img-card-small">
<img src="./assets/images/laptop.png"> <img src="./assets/images/laptop.png">
</figure> </figure>
<figcaption> <figcaption>
@ -89,7 +89,7 @@
</figcaption> </figcaption>
</div> </div>
<div class="card-small"> <div class="card-small">
<figure> <figure class="img-card-small">
<img src="./assets/images/cel.png"> <img src="./assets/images/cel.png">
</figure> </figure>
<figcaption> <figcaption>