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

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&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&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;
}

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!

Do you have a URL for the site?

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.

Oh, never mind... :blush:

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.

:lamo:

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&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&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;
}

> 
> 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.

Might want to post something in the support fourm here:
[
www.zen-cart.com/forum/showthread.php?t=44474](http://www.zen-cart.com/forum/showthread.php?t=44474)