Edit: problem solved

Edit: problem solved
0

#1

EDIT: SOLVED Hello again, I currently have an “About” section in my portfolio flanked by two columns with image icons.
My goal is have only the middle text column visible on smaller screens, and maybe have the images pushed below it if possible. I think I would need to use a media query but I’m not quite sure how to go about it.
The CSS containing the grid is the #myContainer ID tag. Here’s the project https://codepen.io/MarcelPenn/pen/EeBovx?editors=1111 again any help at all would be much appreciated!


#2

Good job figuring it out!

If I could make a couple of suggestions:

  • You have a horizontal scroll bar that probably doesn’t need to be there. You can hide that with the overflow-x: hidden css rule.
  • While your site responds nicely to being resized, the images inside the portfolio pieces resize as well, you probably want those to have a set width so they don’t end up distorted.

Good luck!


#3

Hey, thanks for the feedback. I think the horizontal scrollbar thing might actually fix an issue I had with responsiveness, where would I place that css rule exactly? And yeah I definitely need to do something about those images haha.


#4

It looks like you figured out the spot for the overflow! And as for the pictures you can set them a set width and put them into a flexbox to keep your responsiveness! Cheers!