Archived topic
Display Overflow on Image
2 replies · Started by ninjajay on January 2, 2021
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