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

refactor: ajusta alinhamento parágrafo infocard #4

Merged
Rafael_Sampaio_de_Oliveira merged 1 commits from refactor/alinhamento_paragrafo-infocard into development 2022-10-10 10:25:55 +00:00
Conversation 0 Commits 1 Files Changed 2 +19 -11
2 changed files with 19 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
assets/styles/styles.css
View File

@ -36,30 +36,36 @@ header {
width: 100%;
}
.infocard div {
.infocard-title {
display: flex;
flex-direction: column;
align-items: center;
margin: 74px 0;
width: 80%;
}
.infocard h2 {
text-align: center;
font-size: 32px;
line-height: 39px;
text-transform: uppercase;
}
.infocard h1 {
text-align: center;
font-weight: 500;
font-size: 48px;
line-height: 58px;
text-transform: uppercase;
}
.infocard-paragraph {
display: flex;
justify-content: center;
width: 100%;
}
.infocard p {
text-align: center;
display: flex;
justify-content: center;
font-size: 16px;
line-height: 24px;
margin-top: 28px;

16
index.html
View File

@ -44,15 +44,17 @@
</figure>
</div>
<section class="infocard">
<div>
<div class="infocard-title">
<h2>Lorem ipsum</h2>
<h1>dolor sit amet</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras
euismod enim non dui fringilla interdum. <br />
Curabitur ut tortor sed lacus egestas vulputate vel sit amet velit.
Nulla suscipit magna dui.
</p>
<div class="infocard-paragraph">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras
euismod enim non dui fringilla interdum. <br />
Curabitur ut tortor sed lacus egestas vulputate vel sit amet
velit. Nulla suscipit magna dui.
</p>
</div>
</div>
<figure>
<img