Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

inline flex – elements area

  • Hi Support,

    I hope you are doing well. I have a strange styling issue on a page that i am using for an element and it has me stumped. I am hoping you can help get me back on track. I have added the link to the page in the private area. Basically I created an element to hook after the primary navigation. It is an image with a background color that runs full length. I have the image area sized correctly and using inline – flex it get it positioned correctly but for some reason there is spacing underneath the photo. (Between the image and the start of the content area) You can see a sliver of the purple background and space on the bottom of the image.

    Any thoughts how I can get rid of the space underneath? I double checked padding and margin for the containers and those look good.

    Any help would be appreciated. I hope you have a great day!!


  • Hi Will,

    Here are the settings:

    Inner Container:

    Display: Default
    Width: 100%
    Max-width: 784px
    Height: auto;

    Then, add this through Appearance > Customize > Additional CSS: {
        aspect-ratio: 784 / 188;

    Parent Container:

    Display: flex
    and align it to the center.

  • WOW! you nailed that. I have been messing with that for a while and couldn’t get that to work. Thank you so much for your help! That was awesome.

    I really appreciate you!

  • You’re welcome!

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.