Site logo

Archived topic

Display Overflow on Image

2 replies · Started by ninjajay on January 2, 2021

Viewing posts 1–3 of 3

To learn GenerateBlocks I'm trying to replicate a design on this page https://jayokey.com/gp-block-test-page. The design of the hero section requires the text in the first container to be in-line with the logo. The astronaut in the second column should be larger than the width of the container and grid elements that contain it. How can I achieve this with Generate Blocks?

The current structure of the section is
1 Container > Grid with two columns
Column 2 just contains a container and the image.

Thanks

I've worked it out. I added a class to the image "hero-astronaut" and added the following CSS to the customizer

@media only screen and (min-width: 769px) {
  .hero-astronaut {
	  max-width: unset;
          width: 125%;
  }
}

Glad to hear that ! Nice design :) Great to see that in GB

This archived topic is closed to new replies.