Adding multiple image or text blocks in a section to be full bleed and equal width and in a strip style with CSS

Hi!

I've created a split section website and in a section on one page I'd like to create smaller blocks (like columns) that appear in a row and are equal width whilst the section acts full bleed (like in the image attached. Example can also be found at https://www.uccf.org.uk/welcoming-new-students). 

It feels like it should be relatively simple but so far the nature of the grid and the site margin mean I can't add equal size blocks that butt up next to each other across the whole page width.  I managed to get this look with a gallery block but I can't seem to add text over the images as I want.  I also don't necessarily want an image gallery but more different coloured square blocks with bold text over the top (and ideally a slide-up text box when hovering over each block that reveals more information).

Can anyone help me here please?  Is there any way to do this with custom CSS?  I've tried everything I can possibly think of and I'm stuck.   I'd really like to solve this if possible as it's a design style I'd like to repeat in different sections across the site.

Thanks!

Which block do you use? Can you share link to your site?

Sorry, forgot to add link to site.  It's www.gbubelgique.com

I haven't managed to figure a way out of achieving what I wanted to so I formatted the information just as text blocks for now.  It's not what I want but it's clear and readable for the time being.  However, if there's a way of achieving the style with the blocks as mentioned above that'd be great!

Thanks!

This is possible with Summary Block or Gallery Section or Blog Page.... Especially if you use a Business Plan or higher, we will have some ways to achieve it.

Do you use Personal plan or? Which page/block do you want to use? This title will be clickable or non-clickable?