"gk-wide-image" is not full width on very wide screens

Hi, there

I really like the full width design of the images in the articles, such as https://demo.gavick.com/joomla25/photo/ ... gle-family I saw the image has a class of "gk-wide-image". I believe this is what makes the image wider than its parent container.

However, on very wide screens, such Apple Cinema Display, if the screen width goes over 1900px, it starts to have padding on the sides, which I think breaks the design. I have also attached a screenshot for it.

Can you tell me how to fix it? I would really appreciate it then!

Thanks!
Josephsome

Can the same issue be seen on our demo server?

The screenshot was taken exactly from the url of https://demo.gavick.com/joomla25/photo/ ... gle-family

I have 1920px wide screen and do not see this issue .

Did you make your browser window full screen? I stretched the Chrome window to over 2000px wide, which you can see from my Macbook Pro. The gk-wide-image starts to have padding, and its box is only 1900px wide max.

Can you help me take a deeper take at it? I would very appreciate it!

Thanks!
Josephsome

I did, and on the demo it looks fine, even over 2000px.

That is quite strange... Because I can see the paddings on different machines all from the same demo link.

Can you help me take a deeper look at it? I am pretty sure the "gk-wide-image" is not full width on screen wider than 1900px.

Thanks!
Josephsome

I did, and on the demo it looks fine, even over 2000px.

Hi, Cyberek

Can you help me take a careful look at this issue? I have attached the screenshot, it cannot be wrong.

I have asked couple questions regarding the template, but none got proper help on fixing the issues. Now I am starting to regret my purchase.

Thanks!

Hello,

Sorry for the late reply, but Cyberek is on vacation.

Regardin your question - the only way is to put a very wide image like 2560px and then for the #gk-bg .gk-wide-image img change the max-width property from 2400px to 2560px.

Personally I really don't recommend to do it, as it will very increase your page weight and additionally it will look good only for small amount of the people with very big screens.

Hello,

Personally I really don't recommend to do it, as it will very increase your page weight and additionally it will look good only for small amount of the people with very big screens.

Hi, Dziudek

Thanks so much for your reply! It worked! I really appreciate it! (My targeted audience tend to have very wide screens sometimes. So it is fine. )

However, is it possible to keep the image to its original aspect ratio? Right now, when I resize the window, the sides of the image get cut.

Thanks again!
Cheers,
Josephsome

Code: Select all

However, is it possible to keep the image to its original aspect ratio? Right now, when I resize the window, the sides of the image get cut.

Unfortunately on some resolutions sides of the image can be cut, due fact that the image is expanded outside the content box and must have max-width in pixels not in %.