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

fix(home): Conserto da posicao relativa do banner do meio desktop

Browse Source
This commit is contained in:
Savio Carvalho Moraes 2022-10-12 10:06:52 -03:00
parent a710d9ba98
commit 78d66e3b13
2 changed files with 13 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
assets/css/style.css
View File

@ -98,6 +98,7 @@ body {
justify-content: center;
background: #e0e0e0;
width: 100%;
margin-bottom: 192px;
}
.image-01 {
@ -115,8 +116,10 @@ body {
grid-template-areas: "image01 image02 image03";
width: 88%;
gap: 40px;
position: relative;
bottom: -62px;
}
.imagens {
.mb-imagens {
width: 100%;
}
@media screen and (max-width: 1023px) {
@ -124,10 +127,12 @@ body {
display: none;
}
.top-infocard {
padding-bottom: 90px;
padding: 73px 0 90px;
margin: 0 28px 0;
}
.top-inforcard-text {
margin: 0 28px 0;
margin-bottom: 65px;
max-width: 100%;
}
.top-infocard-subtitle {
@ -147,8 +152,10 @@ body {
.top-cards {
display: flex;
flex-direction: column;
justify-content: center;
gap: 24px;
margin: 0 32px 80px;
width: 85%;
}
}
@media screen and (min-width: 1024px) {

9
index.html
View File

@ -85,21 +85,18 @@
</figcaption>
</figure>
</section>
<section class="middle-banners">
<div class="middle-banners-wrapper">
<figure class="middle-banner image-01">
<img class="imagens" src="/assets/imagens/middle-banner-image-01.png"
<img class="mb-imagens" src="/assets/imagens/middle-banner-image-01.png"
alt="Imagem do Banner do Meio">
</figure>
<figure class="middle-banner image-02">
<img class="imagens" src="/assets/imagens/middle-banner-image-02.png"
<img class="mb-imagens" src="/assets/imagens/middle-banner-image-02.png"
alt="Imagem do Banner do Meio">
</figure>
<figure class="middle-banner image-03">
<img class="imagens" src="/assets/imagens/middle-banner-image-03.png"
<img class="mb-imagens" src="/assets/imagens/middle-banner-image-03.png"
alt="Imagem do Banner do Meio">
</figure>
</div>