X-Cart forums - Weird underline under thumbnails (Firefox)?

X-Cart forums (https://forum.x-cart.com/index.php)

- Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)

- - Weird underline under thumbnails (Firefox)? (https://forum.x-cart.com/showthread.php?t=25856)

Weird underline under thumbnails (Firefox)?

I'm having a weird little problem that I haven't figured out. All of a sudden (I'm sure I did something), I'm getting an underline under most thumbnails with Firefox (1.5.x and 2.0 RC2/3). The underline is not showing up in IE6 or 7 or Opera 9.

See the problem here:

http://www.hellyhansenusa.com/store/Helly-Hansen-m-1.html

Anybody have a clue?

I'm using both TelaFirma X-Cart Dynamic Image Generator and XC SEO Mods, but I don't think these are doing it.

Scott

Re: Weird underline under thumbnails (Firefox)?

Check the "NoBorder" class....make sure it is indeed set to a border of 0.

Re: Weird underline under thumbnails (Firefox)?

Yep, NoBorder in skin1.css is set to 0.

Quote:

.NoBorder {
border-bottom: 0px solid #FFFFFF;
border-left: 0px solid #FFFFFF;
border-right: 0px solid #FFFFFF;
border-top: 0px solid #FFFFFF;
}
.Thumbnail {
border-bottom: 0px solid #FFFFFF;
border-left: 0px solid #FFFFFF;
border-right: 0px solid #FFFFFF;
border-top: 0px solid #FFFFFF;
}

Re: Weird underline under thumbnails (Firefox)?

I had a similar issue, it appears that you're in the same boat. Go to your authentication box and hover over username and password. See the underlines in Firefox? Here's the fix!

skin1.css replace:

Code:

.VertMenuItems {

        COLOR: #000000;

        TEXT-DECORATION: none;

        margin-left: 5px;

        line-height: 20px;

        font-size: 11px

}

.VertMenuItems:link {

        COLOR: #333333; TEXT-DECORATION: none;

}

.VertMenuItems:visited {

        COLOR: #333333; TEXT-DECORATION: none;

}

.VertMenuItems:hover {

        COLOR: #000000; TEXT-DECORATION: underline;

}

.VertMenuItems:active  {

        COLOR: #333333; TEXT-DECORATION: none;

}

with this:

Code:

a.VertMenuItems {

        COLOR: #000000;

        TEXT-DECORATION: none;

        margin-left: 5px;

        line-height: 20px;

        font-size: 11px

}

a.VertMenuItems:link {

        COLOR: #333333; TEXT-DECORATION: none;

}

a.VertMenuItems:visited {

        COLOR: #333333; TEXT-DECORATION: none;

}

a.VertMenuItems:hover {

        COLOR: #000000; TEXT-DECORATION: underline;

}

a.VertMenuItems:active  {

        COLOR: #333333; TEXT-DECORATION: none;

}

That might help you image underline, but I doubt it. Post back and I'll look further. The line is also under the BUY NOW button!

Re: Weird underline under thumbnails (Firefox)?

Thanks, that fixed the behavior you pointed out with the authentication boxes, but not the thumbnails.

Scott

Re: Weird underline under thumbnails (Firefox)?

Your problem is due to this:

Code:

A:link {

        COLOR: #000000; TEXT-DECORATION: underline;

If you make TEXT-DECORATION: none it will get rid of the line, but you loose your underline in all links. Interesting enough I see I'm having the same issue, but I only use underline when hovering. I'll have to dig a little deeper.

Re: Weird underline under thumbnails (Firefox)?

Quote:

Originally Posted by ranger82nd

Your problem is due to this:

Code:

A:link {

    COLOR: #000000; TEXT-DECORATION: underline;

Yep, you are right.

I want to keep my text links underlined, but not for thumbnails. The question is, why is only Firefox showing the thumbnails with an underline?

Re: Weird underline under thumbnails (Firefox)?

It's something to do with Telafirma's image mod (I think) it's just not jumping out at me?

Re: Weird underline under thumbnails (Firefox)?

Fixed it!

skin1/customer/main/products.tpl and find:

Code:

{* SAFETYNET DSEFU MOD *}

{if $enable_seo_links == "Y"}

<A href="{seo_link prod_name=$products[product].product prod_id=$products[product].productid}" title="{$products[product].product}">{include file="product_thumbnail.tpl" productid=$products[product].productid image_x=$config.Appearance.thumbnail_width product=$products[product].product tmbn_url=$products[product].tmbn_url class="NoBorder" alt=$products[product].product|escape}<BR>{$lng.lbl_see_details}</A>

{else}

<A href="product.php?productid={$products[product].productid}&cat={$cat}&page={$navigation_page}{if $featured eq 'Y'}&featured{/if}">{include file="product_thumbnail.tpl" productid=$products[product].productid image_x=$config.Appearance.thumbnail_width product=$products[product].product tmbn_url=$products[product].tmbn_url class="NoBorder" alt=$products[product].product|escape}<BR>{$lng.lbl_see_details}</A>

{/if}

{* END SAFETYNET DSEFU MOD *}

and change it to:

Code:

{* SAFETYNET DSEFU MOD *}

{if $enable_seo_links == "Y"}

<A href="{seo_link prod_name=$products[product].product prod_id=$products[product].productid}" title="{$products[product].product}">{include file="product_thumbnail.tpl" productid=$products[product].productid image_x=$config.Appearance.thumbnail_width product=$products[product].product tmbn_url=$products[product].tmbn_url class="NoBorder" alt=$products[product].product|escape}</A><BR>

<A href="{seo_link prod_name=$products[product].product prod_id=$products[product].productid}" title="{$products[product].product}">{$lng.lbl_see_details}</A>

{else}

<A href="product.php?productid={$products[product].productid}&cat={$cat}&page={$navigation_page}{if $featured eq 'Y'}&featured{/if}">{include file="product_thumbnail.tpl" productid=$products[product].productid image_x=$config.Appearance.thumbnail_width product=$products[product].product tmbn_url=$products[product].tmbn_url class="NoBorder" alt=$products[product].product|escape}<BR>{$lng.lbl_see_details}</A>

{/if}

{* END SAFETYNET DSEFU MOD *}

I'm not really sure if it's the image mod or DSEFU, regardless that should get rid of the line under the thumbnail.

Re: Weird underline under thumbnails (Firefox)?

I don't have DSEFU installed, but I do have the XC SEO mod installed. Here is my products.tpl.

Quote:

{if $active_modules.Feature_Comparison ne '' && $products && $printable ne 'Y'}
{include file="modules/Feature_Comparison/compare_selected_button.tpl"}
{include file="modules/Feature_Comparison/products_check_js.tpl"}
{/if}
{if $usertype eq "C" and $config.Appearance.products_per_row ne "" and $config.Appearance.products_per_row gt 0 and $config.Appearance.products_per_row lt 4 and ($featured eq "Y" or $config.Appearance.featured_only_multicolumn eq "N")}
{include file="customer/main/products_t.tpl" products=$products}
{else}
{if $products}
{section name=product loop=$products}
{assign var="discount" value=0}
<TABLE border="0" width="100%" cellspacing="15px">
<TR>
<TD width="150" align="center" valign="top">
{if $active_modules.Special_Offers ne "" and $products[product].have_offers}
{include file="modules/Special_Offers/customer/product_offer_thumb.tpl" product=$products[product]}
<A href="product.php?productid={$products[product].productid}&cat={$cat}&page={$navigation_page}{if $featured eq 'Y'}&featured{/if}">{$lng.lbl_see_details}</A>
{else}
<A href="product.php?productid={$products[product].productid}&cat={$cat}&page={$navigation_page}{if $featured eq 'Y'}&featured{/if}">
{* {include file="product_thumbnail.tpl" productid=$products[product].productid image_x=$config.Appearance.thumbnail_width product=$products[product].product tmbn_url=$products[product].tmbn_url} *}
{* New Dynamic Image Mod - TelaFirma *}
{include file="product_thumbnail.tpl" productid=$products[product].productid image_x=$config.Appearance.thumbnail_width product=$products[product].product tmbn_url=$products[product].tmbn_url class="NoBorder" alt=$products[product].product|escape}
{* /New Dynamic Image Mod - TelaFirma *}
 {$lng.lbl_see_details}</A>
{/if}
{if $active_modules.Feature_Comparison ne '' && $products[product].fclassid > 0 && $printable ne 'Y'}
 
 
{include file="modules/Feature_Comparison/compare_checkbox.tpl" id=$products[product].productid}
{/if}
</TD>
<TD valign="top">
<A href="product.php?productid={$products[product].productid}&cat={$cat}&page={$navigation_page}{if $featured eq 'Y'}&featured{/if}">{$products[product].product}</A>
 

{$lng.lbl_sku}: {$products[product].productcode}

 
 
{$products[product].descr|truncate:300:"...":true}
 

<HR size="1" noshade width="100%" align="left">
{if $products[product].product_type eq "C"}
{include file="buttons/details.tpl" href="product.php?productid=`$products[product].productid`&cat=`$cat`&page=`$navigation_page`"}
{else}
{if $active_modules.Subscriptions ne "" and ($products[product].catalogprice gt 0 or $products[product].sub_priceplan gt 0)}
{include file="modules/Subscriptions/subscription_info_inlist.tpl"}
{else}
{if $products[product].taxed_price ne 0}
{if $products[product].list_price gt 0 and $products[product].taxed_price lt $products[product].list_price}
{math equation="100-(price/lprice)*100" price=$products[product].taxed_price lprice=$products[product].list_price format="%3.0f" assign=discount}
{if $discount gt 0}
{$lng.lbl_market_price}: <S>
{include file="currency.tpl" value=$products[product].list_price}
</S> 
{/if}
{/if}
{if $active_modules.Special_Offers ne "" and $products[product].use_special_price ne ""}
<S>
{/if}
{$lng.lbl_our_price}: {include file="currency.tpl" value=$products[product].taxed_price}{include file="customer/main/alter_currency_value.tpl" alter_currency_value=$products[product].taxed_price}{if $discount gt 0}{if $config.General.alter_currency_symbol ne ""},{/if} {$lng.lbl_save_price} {$discount}%{/if}
{if $active_modules.Special_Offers ne "" and $products[product].use_special_price ne ""}
</S>
{/if}
{if $products[product].taxes}
 
<TABLE border="0">
<TR>
<TD><IMG src="{$ImagesDir}/spacer.gif" width="70" height="1" alt=""></TD>
<TD>{include file="customer/main/taxed_price.tpl" taxes=$products[product].taxes}</TD>
</TR>
</TABLE>
{/if}
{if $active_modules.Special_Offers ne "" and $products[product].use_special_price ne ""}
{include file="modules/Special_Offers/customer/product_special_price.tpl" product=$products[product]}
{/if}
{else}
{$lng.lbl_enter_your_price}
{/if}
{/if}
{if $usertype eq "C" and $config.Appearance.buynow_button_enabled eq "Y"}
{include file="customer/main/buy_now.tpl" product=$products[product]}
{/if}
{/if}
</TD></TR>
</TABLE>
 
 
 
{/section}
{if $active_modules.Feature_Comparison ne '' && $products && $printable ne 'Y'}
{include file="modules/Feature_Comparison/compare_selected_button.tpl"}
{/if}
{else}
{$lng.txt_no_products_found}
{/if}
{/if}

Re: Weird underline under thumbnails (Firefox)?

Try replacing:

Code:

{* New Dynamic Image Mod - TelaFirma *}

{include file="product_thumbnail.tpl" productid=$products[product].productid image_x=$config.Appearance.thumbnail_width product=$products[product].product tmbn_url=$products[product].tmbn_url class="NoBorder" alt=$products[product].product|escape}

{* /New Dynamic Image Mod - TelaFirma *}

<BR>{$lng.lbl_see_details}</A>

with this:

Code:

{* New Dynamic Image Mod - TelaFirma *}

{include file="product_thumbnail.tpl" productid=$products[product].productid image_x=$config.Appearance.thumbnail_width product=$products[product].product tmbn_url=$products[product].tmbn_url class="NoBorder" alt=$products[product].product|escape}</A><BR>

<A href="product.php?productid={$products[product].productid}&cat={$cat}&page={$navigation_page}{if $featured eq 'Y'}&featured{/if}">{$lng.lbl_see_details}</A>

{* /New Dynamic Image Mod - TelaFirma *}

BACKUP YOUR ORIGINAL FILE!

Re: Weird underline under thumbnails (Firefox)?

It works. ranger82nd - you rock! Thanks for your help.

Re: Weird underline under thumbnails (Firefox)?

:wink:
You still have an issue with a line under your Buy Now button though!

Re: Weird underline under thumbnails (Firefox)?

Yeah, but that one doesn't bother me too much. Kinda looks ok. I plan on changing the button at some point, so I'll tackle that one when the time comes.

Thanks again for your help.

Re: Weird underline under thumbnails (Firefox)?

You know what, that is the table width in your buttons/button.tpl you see it in IE also! Just make the table width slightly smaller, that should fix that also.