Keyword
Please note that official support for commercial extensions & templates is provided in the Subscriber Help Desk.
Support requests should ONLY be directed there and require an active subscription plan.
This forum board is to be used for archive purposes and knowledge exchange ONLY.

Incorrect image height on thumbnails

  • Luke Douglas
  • Luke Douglas's Avatar Topic Author
  • Offline
  • Senior Member
More
2 months 3 days ago - 2 months 3 days ago #172026 by Luke Douglas
Luke Douglas created the topic: Incorrect image height on thumbnails
I have used SIG (the free version for about 6-7 years and the Pro version for the past 4-5 years). I have 'always' had to add CSS override coding to correct thumbnail borders. I use Joomla on all of my client websites, all are updated to the most recent version, I use the Gantry platform which is the most recent version. It has been a perplexing problem.

webbering.com/images/troubleshooting/sig-thumb-borfder-problem.jpg

Here is the code for a specific thumbnail. It forces a "style="width:200px;height:160px;" " for the <A> tag. However, it also forces a "style="width:200px;height:160px;" in the <IMG> tag. If I view with developer tools, it is calculating the <IMG> tag as "img.sigProImg 172x160". However, in the <A> tag, it calculates the size as "a.sigProLink.fresco 200x172". With a 4 pixel border, I think you can see the problem. The calculation of the <IMG> tag should be "172x144" as the <A> tag contains the "200x160" image background to match up with the 200x160 settings in the component.

<span class="sigProLinkWrapper">
<a href="/images/gallery/2019-04-12-VOCAL-NCVRW-Vigil/2019-04-12-VOCAL-NCVRW-Vigil-001.jpg" class="sigProLink fresco" style="width:200px;height:160px;" rel="fresco[galleryd0f096cea0]" title="" data-fresco-caption="" target="_blank" data-thumb="/cache/jw_sigpro/jwsigpro_cache_d0f096cea0_2019-04-12-vocal-ncvrw-vigil-001.jpg" data-fresco-group="d0f096cea0">
<img class="sigProImg" src="/plugins/content/jw_sigpro/jw_sigpro/includes/images/transparent.gif" alt="Click to enlarge image 2019-04-12-VOCAL-NCVRW-Vigil-001.jpg" title="Click to enlarge image 2019-04-12-VOCAL-NCVRW-Vigil-001.jpg" style="width:200px;height:160px;background-image:url('/cache/jw_sigpro/jwsigpro_cache_d0f096cea0_2019-04-12-vocal-ncvrw-vigil-001.jpg');"></a>
</span>

I have tried enabling "Smart thumbnail resize based on above dimensions" but it had no effect.

I believe the culprit is the "height:auto !important" setting in the CSS.

Here is the link:
vocalonline.org/news/vocal-news/291-2019-vocal-vigil-honoring-our-past-creating-hope-for-the-future

If you have any suggestion, I would appreciate some feedback.
Last edit: 2 months 3 days ago by Luke Douglas.

Please Log in or Create an account to join the conversation.

  • Fotis
  • Fotis's Avatar
  • Offline
  • Administrator
  • JoomlaWorks Support Team
More
2 months 1 day ago #172045 by Fotis
Fotis replied the topic: Incorrect image height on thumbnails
See my response in our helpdesk system. Long story short, it's a CSS issue caused by a global rule in Gantry.

If you use & love K2, please take a moment to add your review and rate it
at the Joomla Extensions Directory: extensions.joomla.org/extension/k2/


IMPORTANT: Please search the forum before posting a question!

JoomlaWorks Support Team Member

Please Log in or Create an account to join the conversation.


Powered by Kunena Forum