Site logo

[Resolved] How to add full screen Image in a webpage

Home Forums Support [Resolved] How to add full screen Image in a webpage

Home Forums Support How to add full screen Image in a webpage

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #2514063
    Disha

    Hi there,

    I am using a Page hero. I want to create a page , where below page hero, I am trying to add fit-to-screen image. I tried using container and setting the image as background. but its not taking the full screen.

    I tried using GB Image and styling it as cover, but the sides are still empty. Image size is 1587×2248.

    What do I need to use here?

    Thanks
    Disha Gupta

    #2514142
    David
    Staff
    Customer Support

    Hi there,

    In the GB Image Block, set jsut the width to 100% and set the Object Fit to: Cover

    #2524251
    Disha

    Hi,

    I Tried this. It gives same result.
    Image at Sides are empty

    The Pink image is container with background image.
    The black image is GP image with width 100% set as cover.

    Thanks
    Disha

    #2524414
    David
    Staff
    Customer Support

    That image link is not working – can you check the link?

    And if you can share a link to your site where the problem is, i can take a closer look

    #2524443
    Disha

    Hi,

    https://postimg.cc/mhn4QFCM

    can you access this. I have put site under maintenance.
    The pink tree part is container with background as image.
    The black is GB Image with the suggestion you provided above.

    You can take a look at this

    I am trying the same thing and unable to complete it.

    Thanks
    Disha

    #2524935
    Ying
    Staff
    Customer Support

    Hi Disha,

    In order to make images or containers go full width, the page’s content container needs to be set to full width.

    You can do so via the layout metabox in the page editor:
    https://docs.generatepress.com/article/layout-metabox-overview/#where-is-it

    #2525447
    Disha

    Thanks

    #2526560
    Ying
    Staff
    Customer Support

    No Problem 🙂

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