Full Image in Grid (Right Container)

[pop]

Hi There,

Could you please advise how to make Full image in Grid (Right Container) as attached link

https://www.img.in.th/image/hndvxH

https://www.img.in.th/image/hndCaA

https://www.img.in.th/image/hnd0xS

The Image in Right Container still be full width no matter open in any device (Desktop, Tablet, Mobile)

Please kindly advise how to set up

thank you
pop

[David]

Hi there,

can you provide a link to the site where i can see the issue ?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[pop]

thanks David, My site is https://www.palagrit.com

Here is screen when resize to 1600 px width
https://www.img.in.th/image/hnx8rr

and this is screen when resize to 1400 px width
https://www.img.in.th/image/hnxdCw

you can see the gap at the right side

[David]

Aah yes – thats not easy to achieve. Do you want 100% of the image always being displayed? Becuase thats real hard. Let me know.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[pop]

Yes, David. Please kindly advise if it’s possible?

[David]

Unfortunately there isn’t a simple way to maintain 100% of the image on all screen sizes and have it fill 50% of the screen.

You could remove the Image and place it as the background of the right hand column, and set the background element to Pseudo. I could then provide some CSS to make the image fill 50% of the screen…. but it would not be 100% visible on all screen sizes.

Let me know.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[pop]

Hello David

I have set background of right hand column to Pseudo as attached image.

https://www.img.in.th/image/hxfP3c

Please kindly advise if setting is correct? and advise your CSS so that I can try if it work.

thank you

[Author]

Posts