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

Merge branch 'feture/gallery'

Browse Source
This commit is contained in:
Matheus Mariosa 2022-10-13 19:50:15 -03:00
commit 7bd12d413b
2 changed files with 34 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
assents/style/estilo.css
View File

@ -131,7 +131,6 @@ body {
margin: 0;
}
.card-foto-bottom {
display: block;
margin-bottom: 15px;
@ -146,6 +145,35 @@ body {
text-align: center;
}
/*Galeria de fotos*/
.gallery {
display: flex;
justify-content: center;
align-items: center;
background-color: #E0E0E0;
height: 14%;
max-height: 570px;
padding-top: 62px;
}
.gallery-box {
display: flex;
align-items: center;
justify-content: center;
gap: 39px;
width: 30%;
height: 89%;
}
.gallery-foto {
display: block;
width: 100%;
height: 100%;
max-width: 556px;
max-height: 530px;
}
@media screen and (max-width: 1023px) {
.banner-big {
display: none;

10
index.html
View File

@ -54,11 +54,11 @@
</figure>
</section>
<div class="gallery-box">
<div class="gallery">
<img src="./assents/imagens/card-middle-1.png" alt="computador quase completamente fechado">
<img src="./assents/imagens/card-middle-2.png" alt="computador meio completamente fechado">
<img src="./assents/imagens/card-middle-3.png" alt="computador quase completamente fechado de lado">
<div class="gallery">
<div class="gallery-box">
<img class="gallery-foto" src="./assents/imagens/card-middle-1.png" alt="computador quase completamente fechado">
<img class="gallery-foto" src="./assents/imagens/card-middle-2.png" alt="computador meio completamente fechado">
<img class="gallery-foto" src="./assents/imagens/card-middle-3.png" alt="computador quase completamente fechado de lado">
</div>
</div>