The items in my grid are not totally filling up the available space on the right side of the container. And it’s even worse on pages where there are only 3 items. What am I doing wrong?
Hi. Responsive grid is by % - but you set fixed px. thumb-image —> 280px width thumb-link → 280px width
Responsive images set to 100% w and auto: height.
Create div (block element = 100% width of the parent) → in your case the “parent” is the col
Thats it - without any style the div “filling up” the grid.
If you want to “destroy” this - you set px width to the div (280px in your example) - and/or change is style to inline-block (inline - like text - the width related to the content inside)
change - thumb-image & thumb-link + remember you work with bg images + Link Block should be “display: block;” (why you change this to inline-block?)
Thanks, but in this case my 280px wide thumbnails won’t work! They are repeated to fill in the thumb-link. Can’t I rather modify the grid so that the 280px width x3 col would fill in the grid with more space in between the cols?
Also, with 100% width the frame border flips over the screen to the right: MEGA
And now, even though I set min height 200px there is a 1px gap at the bottom of the image, even if my image is exactly 200px high. MEGA