Announcement

Collapse
No announcement yet.

Sub Category lsiting not displaying correctly on IE6 on CTGY page (CSS)

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Sub Category lsiting not displaying correctly on IE6 on CTGY page (CSS)

    I'm having trouble making the sub category listing display correctly on IE6. I am assuming it is some kind of IE6 fix that will need to be applies to the css. But i would like for it to display correctly on all browsers. It currently works just fine for all other browsers. It is also doing this for the Product list code as well. I will past both sets of html and css bleow. The css code is essentially the same but i will still post both. Thanks!

    Subcat Listing HTML:

    <div id="subcategory-listing">
    <mvt:foreach iterator="sub_category" array="sub_categories">
    <mvt:item name="toolkit" param="cattreeimage|subcatImage|l.all_settings:sub _category:code" />
    <mvt:if expr="(pos1 MOD 4) EQ 1">
    <div class="subcategory-wrapper first">
    <mvt:else>
    <div class="subcategory-wrapper">
    </mvt:if>
    <a href="/&mvta:sub_category:code;.html" title="&mvte:sub_category:name;" class="menu2">
    <mvt:if expr="subcatImage">
    <img src="&mvte:global:subcatImage;" alt="&mvte:sub_category:name;" title="&mvte:sub_category:name;" />
    </mvt:if><br>
    &mvte:sub_category:name;</a>
    </div>
    </mvt:foreach>
    </div>

    Subcat Listing CSS

    #subcategory-listing {
    overflow: hidden;
    clear: both;
    text-align: center;
    }


    .subcategory-wrapper {
    width: 160px;
    background: #fff;
    margin: 0 0 16px 16px;
    display: -moz-inline-stack;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    }


    .ie7 .subcategory-wrapper { display: inline; }


    .ie6 .subcategory-wrapper {
    display: inline;
    height: 225px;
    }


    .subcategory-wrapper.first { margin-left: 0; }


    .subcategory-wrapper img {
    max-width: 150px;
    }


    .ie6 .subcategory-wrapper img { width: 150px; }


    #subcategory-listing .subcategory-wrapper-name {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: bold;
    padding: 3px 0 7px;
    display: block;
    }


    .subcategory-wrapper-name a {
    color: #000;
    text-decoration: none;
    }


    #subcategory-listing .subcategory-wrapper p { margin: 0; }


    .subcategory-wrapper form { padding: 5px 0 0; }


    .subcategory-wrapper input { cursor: pointer; }


    .subcategory-wrapper .button {
    display: block;
    margin: 5px 12px;
    }


    Product Listing HTML

    <div id="product-listing">
    <mvt:foreach iterator="product" array="products">
    <mvt:if expr="(pos1 MOD 4) EQ 1">
    <div class="product-wrapper first">
    <mvt:else>
    <div class="product-wrapper">
    </mvt:if>
    <mvt:if expr="NOT ISNULL l.settings:product:imagetypes:main">
    <mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields :IAT">
    <a href="http://www.loveisarose.com/&mvta:product:code;.html" title="&mvte:product:name;"><img src="&mvte:product:imagetypes:main;" alt="&mvt:product:customfield_values:customfields: IAT;" title="&mvte:product:name;">
    <mvt:else>
    <a href="http://www.loveisarose.com/&mvta:product:code;.html" title="&mvte:product:name;"><img src="&mvte:product:imagetypes:main;" alt="&mvte:product:name;" title="&mvte:product:name;">
    </mvt:if>
    <mvt:elseif expr="NOT ISNULL l.settings:product:thumbnail">
    <mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields :IAT">
    <a href="http://www.loveisarose.com/&mvta:product:code;.html" title="&mvte:product:name;"><img src="&mvte:product:thumbnail;" alt="&mvt:product:customfield_values:customfields: IAT;" title="&mvte:product:name;">
    <mvt:else>
    <a href="http://www.loveisarose.com/&mvta:product:code;.html" title="&mvte:product:name;"><img src="&mvte:product:thumbnail;" alt="&mvte:product:name;" title="&mvte:product:name;">
    </mvt:if>
    <mvt:else>
    <mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields :IAT">
    <a href="http://www.loveisarose.com/&mvta:product:code;.html" title="&mvte:product:name;"><img src="../graphics/img_no_thumb.jpg" alt="&mvt:product:customfield_values:customfields: IAT;" title="&mvte:product:name;">
    <mvt:else>
    <a href="http://www.loveisarose.com/&mvta:product:code;.html" title="&mvte:product:name;"><img src="../graphics/img_no_thumb.jpg" alt="&mvte:product:name;" title="&mvte:product:name;">
    </mvt:if>
    </mvt:if>
    <br>
    &mvt:product:name;</a><br>
    <b>Code: &mvt:product:code;</b><br>
    <mvt:if expr="l.settings:product:cost GT l.settings:product:price">
    Reg. Price: <strike>&mvt:product:formatted_cost;</strike> <br>
    <font color="ff0000"><b>Sale Price: &mvt:product:formatted_price;</b></font>
    <mvt:else>
    <b>Price: &mvt:product:formatted_price;</b>
    </mvt:if>
    <mvt:if expr="l.settings:product:inv_active">
    </mvt:if>
    </div>
    </mvt:foreach>
    </div>


    Product Listing CSS

    #product-listing {
    overflow: hidden;
    clear: both;
    text-align: center;
    }


    .product-wrapper {
    width: 150px;
    background: #fff;
    margin: 0 0 26px 26px;
    display: -moz-inline-stack;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    }


    .ie7 .product-wrapper { display: inline; }


    .ie6 .product-wrapper {
    display: inline;
    height: 225px;
    }


    .product-wrapper.first { margin-left: 6px; }


    .product-wrapper img {
    max-width: 150px;
    }


    .ie6 .product-wrapper img { width: 150px; }


    #product-listing .product-wrapper-name {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: bold;
    padding: 3px 0 7px;
    display: block;
    }


    #product-listing .product-wrapper p { margin: 0; }


    .product-wrapper form { padding: 5px 0 0; }


    .product-wrapper input { cursor: pointer; }


    .product-wrapper .button {
    display: block;
    margin: 5px 12px;
    }
    Nick Harkins
    www.loveisarose.com
    *Web Developer
    *Miva
    *Google Analytics, Search Console, Tag Manager, Merchant Center, Ads
Working...
X