I added a grid to my page here:
https://projectpotluck.com/bios
The problem with this layout is that when the browser is made smaller, the images don't reach the bottom of the .bioshorts div and the text stays to the left side of the div and doesn't wrap. I attached a screen shot to show the problem.
I show the code here:
https://codepen.io/makamo66/pen/zYEVxBB
Attachment | Size |
---|---|
bios.png | 207.52 KB |
Maybe I should just use
Maybe I should just use floats instead of a grid. What do you think?
I tried the same using floats
I tried the same using floats and it worked out better. You can see the codepen here: https://codepen.io/makamo66/pen/gOGNBdp
It's not looking good using
It's not looking good using floats either. I just need a way to make my text wrap around the images when I use the grid layout.
I stripped away the
I stripped away the superfluous HTML and added a media query. It's still not wrapping when I make the browser smaller. You can see my effort here:
https://codepen.io/makamo66/pen/zYEVxBB