Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

bottom align grid of image blocks with captions


beckon

Question

Site URL: https://kcostudios.squarespace.com/

Hello,

I'm trying to create a 4x 2 grid of images, where image blocks with captions below take up 1, 2 or 4 squares of the grid. When I have 3 images aligned, I seem to be able to get them to all the same height (using shift to move in pixel increments). But when I have two images stacked on top of each other, I can't get the large image next to it to align. I've been doing it visually but on the live site it will either shift, or it will look pretty close but not scale responsively.

screenshots attached of misalignment.

Site is 7.1

Site is https://kcostudios.squarespace.com/

password: demo

 

Thank you!1155387996_Screenshot2022-05-16at17_21_33.thumb.png.a3d4b65629eeea29d1aaab0719625719.png1267964893_Screenshot2022-05-16at17_05_05.thumb.png.9b8c844c97cf6eef7de0b10ddb01dfb3.png

 

Link to comment
  • Answers 3
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Posted Images

3 answers to this question

Recommended Posts

  • 0

It looks difficult. I think we need to check all screen sizes  & adjust spacing to make sure height is same.

div#page-section-627d8f1605b9d96ca6469ad3 .span-6 .span-3 .image-block {
    padding-top: 8px;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...