Tell us what’s happening:
2 Questions.
- To align the body content in the center, I know you use margin: auto;
But when I do it, unless I have also specify the of my body content,
otherwise the body content still won’t budge… It is only after I have a specified
then the margin:auto; works.
I was wondering, if specifying is mandatory in order to align my content in the center…?
body {
margin: auto;
padding: 0;
width: 1000px;
}
- Regarding using CSS Grid.
I tried to use CSS Grid for one of the sections for my tribute page.
But oddly somehow, after I have the grid areas, column, row, all perfectly set,
when I tried to arrange the spaces/alignment using justify-items or align-items, or justif-content/align-content, everything becomes messed up…
Normal
.discography_details {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr 1fr 1fr;
grid-template-areas:
“title_header details_header”
“title1 details1”
“title2 details2”
“title3 details3”
}
Messed Up
.discography_details {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr 1fr 1fr;
grid-template-areas:
“title_header details_header”
“title1 details1”
“title2 details2”
“title3 details3”
justify-items: center;
}
Output Images
Please kindly assist.
Thank you so much.
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36
.
Challenge: Build a Tribute Page
Link to the challenge: