Can't understand why the grid doesn't centered

HTML-CSS
1

I’m working on the Personal Portfolio Webpage of the (New) Web Design Certificate,and I can’t understand why the Grid doesn’t centered.
Can someone help? Thanks :slight_smile:

The html:

<div id="projects">  
  <div class="project-tile"></div>
  <div class="project-tile"></div>
  <div class="project-tile"></div>
  <div class="project-tile"></div>
</div>

The CSS:

#projects{
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  justify-content: space-evenly;
}
.project-tile{
  width: 100px;
  height: 100px;
  background-color: gray;
}
2

I’m not exactly sure what you mean be “centered”, as there are a few different ways that could be interpreted. But I’m going to guess that you want the justify-items property rather than the justify-content property.

1 Like
3

Thank you very much!
I feel so dumb right now. I don’t know why I didn’t think about it…

4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.