Results 1 to 4 of 4
  1. #1
    Join Date
    Nov 2005
    Posts
    19
    Plugin Contributions
    0

    Default firefox not showing links properly

    hi, i'm still struglling with this... my site is https://secure.vault5.com/thenoblesavage-co-uk/shop/

    the links n rollovers work fine in IE but firefox severley messes with them!! i have posted my css file below, and was hoping someone may be able to explain in english where i could change the code so that it works in all browsers.... thanks in advance... this forum has saved me before and i rely upon the wise now!

    BODY { color: #ffc; font: 11px Verdana, Arial, sans-serif; background-image: none; margin: 0 0 10px; padding: 0; }

    .centershop { color: maroon; background-color: #ffc; padding: 0; margin: 0 auto; position: relative; text-align: left; width: 750px !important; }

    TD.main, P.main { font-size: 18px; font-family: "Zapf Chancery", "Comic Sans MS", cursive; font-weight: 500; line-height: 1.5; background-color: #ffc; }

    A { color: maroon; font-size: 14px; font-family: "Zapf Chancery", "Comic Sans MS", cursive; line-height: 16px; text-decoration: none; }

    A:hover { color: #ffb062; font-family: "Zapf Chancery", "Comic Sans MS", cursive; text-decoration: none; }

    FORM { background-color: #ffc; display: inline; }
    .banners { font-family: "Zapf Chancery", "Comic Sans MS", cursive; padding: 15px; }

    /*HEADER CSS*/

    TABLE.header { color: maroon; font-family: "Zapf Chancery", "Comic Sans MS", cursive; background-image: url(../images/anotherbanner1.gif); background-repeat: no-repeat; background-color: #ffc; background-position: center bottom; border-right: 1px solid #9a9a9a; border-left: 1px solid #9a9a9a; border-bottom: 1px solid #9a9a9a; }

    TABLE.headerNavigation { background-image: url(../images/tile_back.jpg); border-right: 1px solid #9a9a9a; border-left: 1px solid #9a9a9a; border-bottom: 1px solid #9a9a9a; width: 100% !important; }

    TD.headerNavigation { position: relative; vertical-align: middle; font-family: Verdana, Arial, sans-serif; font-weight: bold; color:fuchsia; letter-spacing:1px; padding: 5px; }

    TD.breadCrumb { font-weight: bold; color: maroon; font-family: "Zapf Chancery", "Comic Sans MS", cursive; padding: 3px; border-bottom: 1px dotted #9a9a9a; }

    TD.headerNavigation A, TD.headerNavigation A:visited, td.footertop a { font-weight: bold; color: yellow; font-family: "Zapf Chancery", "Comic Sans MS", cursive; }

    TD.headerNavigation A:hover, td.footertop a:hover { color: #a8cfff; font-family: "Zapf Chancery", "Comic Sans MS", cursive; }

    TR.headerError {
    background: #ff0000;
    }

    TD.headerError {
    font-family: Verdana, Arial, sans-serif;
    background: #ff0000;
    color: #ffffff;
    font-weight : bold;
    text-align : center;
    }

    TR.headerInfo { background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; }

    TD.headerInfo { font-family: Verdana, Arial, sans-serif; color: yellow; font-weight: bold; background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; text-align: center; }

    /*SIDEBOX CSS*/

    .column_left, .column_right, .column_single { font-family: "Zapf Chancery", "Comic Sans MS", cursive; background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; padding: 2px; }

    .boxText { color: yellow; font-size: 11px; line-height: 125%; }
    .leftbox, .rightbox, .centerbox, .singlebox { font-size: 11px; background: #ffc; margin-bottom: 15px; border: solid 1px gray; outline-color: #ffc; }

    .leftboxheading, .rightboxheading, .centerboxheading, .singleboxheading {
    /*background-color: #abbbd3;*/
    font-size: 15px; font-weight: bold; color: yellow; padding: 3px 3px 3px 5px; height: 20px; }

    td.leftboxheading a, td.rightboxheading a, td.centerboxheading a, td.singleboxheading a { color: #ffffff; }

    TR.leftboxheading, TR.rightboxheading, TR.centerboxheading, TR.singleboxheading { background-image: url(../images/tile_back.jpg); background-repeat: repeat; background-attachment: scroll; background-position: 0 0; }

    .leftboxcontent, .rightboxcontent, .centerboxcontent, .singleboxcontent {
    line-height: 125%;
    padding: 4px;
    border-top: 1px solid #9a9a9a;
    border-bottom: 1px solid #9a9a9a;
    }

    .leftboxfooter, .rightboxfooter, .centerboxfooter, .singleboxfooter {
    background-image: url(../images/tile_back.jpg);
    margin-bottom: 15px;
    }

    .plainBox, .plainbox-description { font-family: Verdana, Arial, sans-serif; font-size: 11px; background: #ffc; padding: 0; border-style: none; }
    .plainBoxHeading, TD.tableHeading {
    font-size: 12px;
    font-weight: bold;
    padding: 11px 5px 5px;
    }
    .productListing-heading {
    font-size: 10px;
    font-weight: bold;
    color: yellow;
    padding: 3px;
    height: 20px;
    }

    TD.productListing-heading{
    background-image: url(../images/tile_back.jpg);
    }

    TD.productlisting {
    border:1px solid #9a9a9a;
    }

    TD.productListing-data {
    font-size: 10px;
    padding: 5px;
    }

    /*center main section
    -----------------------------------*/
    TD.pageHeading, DIV.pageHeading, h1 { font-size: 18px; font-weight: 500; color: maroon; font-family: "Zapf Chancery", "Comic Sans MS", cursive; padding-top: 0; }

    .center_column { padding: 8px; }
    .main_page{ width: 100% !important; border-right: 1px solid #9a9a9a; border-left: 1px solid #9a9a9a; border-bottom: 1px solid #9a9a9a; padding: 5px; }

    /* footer
    --------------*/

    TABLE.footer { text-align: center; font-size: 10px; background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; border-right: 1px solid #9a9a9a; border-left: 1px solid #9a9a9a; border-bottom: 1px solid #9a9a9a; }

    TR.footertop {
    background: #abbbd3;
    background-image: url(../images/tile_back.jpg);
    font-size: 11px;
    }

    TD.footertop, TD.footerbottom {
    padding: 5px;
    }

    /*miscellaneous areas
    -------------------------------------*/
    TD.cartBox {
    background: #ffc;
    font-size: 10px;
    padding: 3px;
    border: dotted 1px #ffb062;
    }

    TR.productListing-odd, TR.upcomingProducts-odd {
    background: #ffc;
    }

    TR.productListing-even, TR.upcomingProducts-even, .productsNotifications {
    background: #ffc;
    }

    TD.productListing-data-description-odd {
    background: #ffc;
    font-size: 10px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 12px;
    border-bottom: 1px solid #9a9a9a;
    }

    TD.productListing-data-description-even {
    background: #ffc;
    font-size: 10px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 12px;
    border-bottom: 1px solid #9a9a9a;
    }

    td.pageresults a {
    color: #428dff;
    }

    td.pageresults a:hover {
    background: #FFFF33;
    }

    SPAN.newItemInCart {
    color: #ff0000;
    font-weight: bold;
    }

    TD.smallText, SPAN.smallText, P.smallText, td.pageresults{
    font-size: 10px;
    }

    TD.fieldKey {
    font-size: 12px;
    font-weight: bold;
    }

    TD.fieldValue {
    font-size: 12px;
    }

    CHECKBOX, INPUT, RADIO, SELECT {
    font-size: 11px;
    }

    TEXTAREA {
    width: 100%;
    font-size: 11px;
    }

    .greetUser {
    font-size: 12px;
    padding-top: 0;
    padding-bottom: 0;
    }

    SPAN.greetUser {
    color: #f0a480;
    font-weight: bold;
    }

    SPAN.markProductOutOfStock {
    color: #c76170;
    font: bold 12px Verdana, Arial, sans-serif;
    }

    span.normalprice {
    text-decoration: line-through;
    }

    SPAN.productSpecialPrice, SPAN.productSalePrice, .stockWarning, span.coming {
    color: #ff0000;
    }

    span.productSpecialPriceSale {
    color: #ff0000;
    text-decoration: line-through;
    }

    SPAN.productPriceDiscount, .inputRequirement {
    font-size: 10px;
    color: #FF0000;
    }
    .moduleRow { }
    .moduleRowOver { background-color: #D7E9F7; cursor: pointer; }
    .moduleRowSelected { background-color: #E9F4FC; }

    /* message box */

    .messageBox {}
    .messageStackError, .messageStackWarning, errorBox {
    background-color: #ff0000;
    color: #ffffff;
    font-size: 10px;
    padding: 4px;
    border: 1px solid #9a9a9a;
    }
    .messageStackSuccess { background-color: #b3ffa8; padding: 2px; border: 1px solid #9a9a9a; }
    .messageStackCaution { font-family: Verdana, Arial, sans-serif; font-size: 10px; background-color: #ffff00; }

    /* checkout totals */
    TD.ot-subtotal-Text, TD.ot-cod-fee-Text, TD.ot-total-Text, TD.ot-group-pricing-Text, TD.ot-gv-Text, TD.ot-loworderfee-Text, TD.ot-shipping-Text, TD.ot-subtotal-Text, TD.ot-tax-Text, TD.ot-coupon-Text {
    font-weight: bold;
    }
    TD.ot-total-Amount {
    font-weight: bold;
    border-top: 1px solid #9a9a9a;
    }
    TD.ot-subtotal-Amount, TD.ot-cod-fee-Amount, TD.ot-group-pricing-Amount, TD.ot-gv-Amount, TD.ot-loworderfee-Amount, TD.ot-shipping-Amount, TD.ot-subtotal-Amount, TD.ot-tax-Amount, TD.ot-coupon-Amount {}


    /* product_info attribute comments */

    .ProductInfoComments, TD.ProductInfoComments, SPAN.ProductInfoComments {
    color: #ff0000;
    font-size: 10px;
    text-align : left;
    font-weight: bold;
    padding-top: 6px;
    padding-bottom: 6px;
    border-top: 1px solid #9a9a9a;
    }

    /* General alert span class */
    TD.alert, SPAN.alert {
    color: #FF0000;
    font-weight: bold;
    }

    /* General alert span class */
    TD.alertBlack, SPAN.alertBlack {
    color: #000000;
    font-weight: bold;
    }

    /* popup tables */
    TABLE.popupattributeqty, TABLE.popupcouponhelp, TABLE.popupcvvhelp, TABLE.popupimage, TABLE.popupimageadditional, TABLE.popupsearchhelp, TABLE.popupshippingestimator, TABLE.popupinfoshoppingcart {
    background-color: #ffffff;
    margin: 6px;
    padding: 6px;
    font: 11px Verdana, Arial, sans-serif;
    }

    /* categories_description */
    TABLE.categoriesdescription {
    font-family: Verdana, Arial, sans-serif;
    font-size: 11px;
    background: #D0D0D0;
    border:1px solid #9a9a9a;
    }

    TD.categoriesdescription {
    font-size: 11px;
    line-height: 1px;
    }

    /* categories box parent and child categories */
    A.category-top {
    color: maroon;
    text-decoration: none;
    padding: 10px;
    }
    A.category-links { color: gray; text-decoration: none; }
    A.category-subs, A.category-products {
    color: #FF0000;
    text-decoration: none;
    }
    SPAN.category-subs-parent {
    font-weight: bold;
    }
    SPAN.category-subs-selected {
    font-weight: bold;
    }

    /* attribute images table */
    TABLE.products-attributes-images {
    /* width: 100%; */
    /* border: 1px solid #9a9a9a; */
    float: left;
    padding: 2px;
    }

  2. #2
    Join Date
    Feb 2006
    Location
    Chicago
    Posts
    1,162
    Plugin Contributions
    0

    Default Re: firefox not showing links properly

    Strange!
    When I click on hats in Categories, I get Mens Hoodies
    Even I would like to know the cause of this!
    San

  3. #3
    Join Date
    Apr 2006
    Location
    London, UK
    Posts
    10,569
    Plugin Contributions
    25

    Default Re: firefox not showing links properly

    Firstly, no need to post all that CSS. It cloggs up the forum and I doubt anybody will ever look at it, as it's much easier to see what's happening by digging through the live site.

    The only rollover issue that I can see is with the categories sidebox and in fact it#s Internet Explorer that's getting it wrong. OK, I know that it doesn't look that way to you, but Firefox and Opera are correctly interpreting your CSS, IE (not unusually) is screwing up.

    The "problem" from your perspective, is that by styling a.category-top you are making a very specific statement that overrides styling for all links with class category-top even when in hover state. If you make this a little more general by changing it to .category-top a, then your default hover state styling will not be overridden, i.e. you will get the effect you want.
    Kuroi Web Design and Development | Twitter

    (Questions answered in the forum only - so that any forum member can benefit - not by personal message)

  4. #4
    Join Date
    Apr 2006
    Location
    London, UK
    Posts
    10,569
    Plugin Contributions
    25

    Default Re: firefox not showing links properly

    Quote Originally Posted by superprg
    Strange!
    When I click on hats in Categories, I get Mens Hoodies
    Even I would like to know the cause of this!
    San
    This is happening because of the
    padding: 10px;
    in the a.category-top styling. This is adding padding above and below which is ignored by the browsers for layout purposes (as these links are inline), but not when calculating their size, so they have whopping great vertical overlaps and when you hover, the browsers are not always sure which one you're actually hovering over. This should be changed to
    padding-left: 10px;
    Kuroi Web Design and Development | Twitter

    (Questions answered in the forum only - so that any forum member can benefit - not by personal message)

 

 

Similar Threads

  1. Grid layout is not working properly in Firefox
    By domfang in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 22 Dec 2009, 11:18 PM
  2. IE7 not showing content as properly as Firefox
    By Luvmoomoo in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 29 Aug 2009, 06:13 AM
  3. Site is not working properly in Firefox
    By dsaini77 in forum Basic Configuration
    Replies: 3
    Last Post: 21 Apr 2009, 07:10 PM
  4. Page not displaying properly in firefox
    By kajunto in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 23 Aug 2007, 02:14 PM
  5. The links in my Information sidebox are not showing properly in IE
    By Slippery Snake in forum General Questions
    Replies: 1
    Last Post: 16 Jul 2007, 03:31 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
disjunctive-egg
Zen-Cart, Internet Selling Services, Klamath Falls, OR