.back and .forward classes -> poor rendering in Firefox for me

[Stevietheman]

There are places throughout my store (based on Simple Zen template) where there is one div with class="forward" followed by another with class="back".

All of these are rendering perfectly in IE6, but are exhibiting odd behavior in Firefox 2 (presumably in any Firefox release).

For instance, on a product information page, I have the "Tell a Friend" button followed by the "Reviews" button, and the code is output like so:

<!--bof Tell a Friend button -->
<div id="productTellFriendLink" class="buttonRow forward"><a href="http://127.0.0.1/1-store-bryansbush-com/index.php?main_page=tell_a_friend&amp;products_id=8"><img src="includes/templates/simple_zen/buttons/english/button_TellAFriend.gif" alt="Tell a Friend" title=" Tell a Friend " width="113" height="43" /></a></div>
<!--eof Tell a Friend button -->

<!--bof Reviews button and count-->
<div id="productReviewLink" class="buttonRow back"><a href="http://127.0.0.1/1-store-bryansbush-com/index.php?main_page=product_reviews_write&amp;products_id=8"><img src="includes/templates/simple_zen/buttons/english/button_write_review.gif" alt="Write Review" title=" Write Review " width="171" height="34" /></a></div>
<br class="clearBoth" />
<!--eof Reviews button and count -->

The forward and back classes are defined like so:

.back {
    float: left;
    }
    
.forward, #shoppingCartDefault #PPECbutton { {
    float: right;
    }

In this case, in Firefox, the "Tell a Friend" button is stacked on top of the "Reviews" button on the left.

But... the "Tell a Friend" button _should_ be appearing on the right.

Can anyone tell me what I can look for to resolve this?

Thanks!

[clydejones]

Do you have a URL for the site?

[Stevietheman]

Since the store hasn't been opened to the public, I cannot place the link here.

However, if you like, I can provide you a link via private message.

[Stevietheman]

Oh, never mind...

My 40-year-old eyes were playing tricks on me.

I didn't see the extra left bracket in:

.forward, #shoppingCartDefault #PPECbutton { {
float: right;
}

And this appears to be the original code from the Simple Zen template I downloaded from the Zen Cart site.

This should teach me to regularly run my (and others') CSS through a validator. I'm smacking my own face right now.

[jettrue]

There are places throughout my store (based on Simple Zen template) where there is one div with class="forward" followed by another with class="back".

All of these are rendering perfectly in IE6, but are exhibiting odd behavior in Firefox 2 (presumably in any Firefox release).

For instance, on a product information page, I have the "Tell a Friend" button followed by the "Reviews" button, and the code is output like so:

<!--bof Tell a Friend button -->
<div id="productTellFriendLink" class="buttonRow forward"><a href="http://127.0.0.1/1-store-bryansbush-com/index.php?main_page=tell_a_friend&amp;products_id=8"><img src="includes/templates/simple_zen/buttons/english/button_TellAFriend.gif" alt="Tell a Friend" title=" Tell a Friend " width="113" height="43" /></a></div>
<!--eof Tell a Friend button -->

<!--bof Reviews button and count-->
<div id="productReviewLink" class="buttonRow back"><a href="http://127.0.0.1/1-store-bryansbush-com/index.php?main_page=product_reviews_write&amp;products_id=8"><img src="includes/templates/simple_zen/buttons/english/button_write_review.gif" alt="Write Review" title=" Write Review " width="171" height="34" /></a></div>
<br class="clearBoth" />
<!--eof Reviews button and count -->

The forward and back classes are defined like so:

.back {
    float: left;
    }
    
.forward, #shoppingCartDefault #PPECbutton { {
    float: right;
    }

In this case, in Firefox, the "Tell a Friend" button is stacked on top of the "Reviews" button on the left.

But... the "Tell a Friend" button _should_ be appearing on the right.

Can anyone tell me what I can look for to resolve this?

Thanks!

The error is there in the code above. There are two {'s after #PPECbutton. My fault. Remove that extra one and it should be fine.

[clydejones]

Might want to post something in the support fourm here:

www.zen-cart.com/forum/showthread.php?t=44474