Setting margins on grid elements pushing them out of row?

General
1

Here’s my codepen:

https://codepen.io/thedodus/pen/ooVjYd

I’ve taken to drawing borders around my elements so that I can understand better what padding and margins are doing to everything, as well as the grid. Can’t for the life of me target the images though - aren’t they just img elements? If so, why can I not draw borders around them?

Any feedback is welcome and appreciated, on this or any other issue with the portfolio project so far.

EDIT:

OK, solved that problem. Now I can’t figure out how to set margins in my grid row without pushing the last element out of the row and onto another line. I don’t want to use padding because I want the border-radii on the images directly, but I’m guessing that would be one obvious solution.

2

I only see one image and it’s looking good. One suggestion, since you’re using bootstrap, why not take it’s classes for the navbar. That way it would be responsive on mobile devices.

1 Like
3

Good suggestion, thanks! I’ve been digging through their documentation for this and there’s a ton of useful stuff - thanks for pointing me in that direction.

4

I really think the navbar on mobile looks good, or at least acceptable. The whole hamburger navbar is going out of style, and mobile minimalistic navigation bars is the thing now

1 Like