Creating CSS buttons vs Image buttons

Copy the image of proceed to checkout , or save the image in your PSD  your preferred file format, and save it in your magento directory skin/frontend/default/default/images

The HTML
Let’s take “Proceed to Checkout” image button in the shopping cart for the occasion (it can be found in app/design/frontend/default/default/template/checkout/onepage/link.phtml in the Magento folder structure)

<a href="<?=$this->getCheckoutUrl()?>"><img src="<?=$this->getSkinUrl('images/btn_proceed_to_checkout.gif')?>" alt="<?=__('Proceed to Checkout')?>"/>
</a>

HTML for CSS button - change the style of the button with just a swap of the background

<a class="img-btn btn-checkout" href="<?php echo $this->getCheckoutUrl()?>">
<span><?php echo Mage::helper('checkout')->__('Proceed to Checkout');?>
</span>
</a>

Swap out the ‘HTML for Image button’ code with the ‘HTML for CSS button’ code.
Note: The ‘img-btn’ class in the HTML just serves to unite all the CSS buttons in case you want to synchronize the font colors and sizes..etc.

The CSS
.btn-checkout {
    display:block;
    float:right;
    background:transparent url(../images/btn_proceed_to_checkout_rad.gif) no-repeat 100% 0;
    font-size:15px;
    font-weight:bold;
    padding-right:8px;
    }
.btn-checkout, .btn-checkout:hover {
    color:#fef5e5;
    text-decoration:none;
    }
.btn-checkout span {
    display:block;
    padding:0 17px 0 25px;
    background:transparent url(../images/btn_proceed_to_checkout_bg.gif) no-repeat;
    line-height:40px;
    }
And there you have it! - An all CSS-powered button.

<a class="img-btn btn-checkout" href="<?php echo $this->getCheckoutUrl()?>">
<span><?php echo $this->__('Proceed to Checkout')?>
</span>
</a>
And then it worked well... :)

Apply on the Place Order button
copy the file app/design/frontend/default/default/template/checkout/onepage/review.phtml in your design path, and replace :

<input type="image" src="<?php echo $this->getSkinUrl('images/btn_place_order.gif') ?>" onclick="review.save();" value="<?php echo $this->__('Place Order') ?>" />
to :

<a class="img-btn btn-checkout" href="#" onclick="review.save();"><span><?php echo $this->__('Place Order') ;?></span></a>
The “Place Order” button is now css powered and can be translated easily!

just apply and check with your own button image