How can I set the divs to be in the center and not scattered when scrolling?
Hello, I haven't been able to deal with one thing for a long time. I would like these divs to be in the middle in three or four elements like in the image? I use portfolio and modal. I don't know what else to write, I showed everything in the picture.
Best regards and thanks for help.
20 Replies
use grid
we can't really help more than that without seeing your code, preferably in codepen or something similar
First time I use codepen
https://codepen.io/Bartomiej-/pen/MWLBpjO
change
.portfolio to this:
Yeah that's I wanted but its this okay if I am scrolling and elements are scattered? I send image but also I want to have in center. I'll be glad if u help
I'm not sure I understand what you're asking
Sorry my english is bad. Just like in the image above I would like to have these divs (my portfolio) have it in the middle. If scrolling, it should be like in this picture.
When I scroll, there are large spaces and I would like it to be closer. Do you understand what I am asking? π
ah, you should set a
max-width on the portfolio items and then replace justify-content: space-around; with justify-content: center;Okay let me try that
depending on the portfolio items, you may not have to set the max-width
Yeah that's I wanted! But I changed this code "justify-content: center;" but it doesn't seem to work. The elements are still from the left, not in the middle.
can you update the codepen?
Here you have
ah, I forgot the grid will space across the entire width of the grid parent, which is 100% of the viewport. Add
width: fit-content; to the .portfolio classI think its looking fine for me but still I don't have my elements in middle like "text-align: center"
margin-left: auto;
margin-right: auto;
I added to .portfolio and now its in middle. It's okay to use those codes? π
sorry, got distracted by work π
Yeah, that's fine
you could also make
.wrapper display: flex, or use grid, but using margin:auto is fine tooIt's okay, don't worry. Please do not close the topic, if I need something, I will write here so as not to constantly create a new topic.
Thanks for help! π
if it's a separate issue, we actually prefer if people create new topics
even if it's something different with the same site / project, please make a new topic. If there's other issues with this grid layout, you can post more stuff in here.
Sure no problem