Draw me completely or how to stretch the "submit" and "button"

Designers often have to contend with "designer charms." No exception are buttons like "submit" and "button". It is necessary to perform the layout in accordance with the PSD layout, and even not to forget about the excessive consumption of traffic and crossbrowser page.

Problems usually begin when the button has rounded corners, tricky borders and gradients as in the picture above.
Today I would like to share my personal experience in solving this problem.

')
And so we proceed to the decision:

The choice of this solution is due to the mandatory requirement of correct display in IE below version 9 (without css3).

1. We divide the button into 3 parts: the left rounding, the central strip 1px wide and the right rounding:

2. Make a “div” in which there will be a button and ask it position: relative;
3. Next, we “shove” the received pngs along the tags “div” and in the center we write the text with the color “transparent” (this is necessary so that the button extends to the required width);
.button .left_part {
width: 21px;
height: 44px;
background-image: url(../images/left_part_button.png);
float: left;
}
.button .centr_part {
height: 44px;
background-image: url(../images/centr_part_button.png);
float: left;
font-size: 24px;
line-height: 41px;
color: transparent;
position: relative;
z-index: 0;
}
.button .right_part {
width: 21px;
height: 44px;
float: left;
background-image: url(../images/right_part_button.png);

4. The next step is to add the submit itself, wrap it in a 1px div, set its width: 100% and position: absolute, style it according to the height of the font color, etc. The resulting place in front of 3 parts of the button.

It seems everything works “as it should,” but when a veteran of IE comes into play, a problem appears,

IE does not understand color: transparent. Text that in the "submit" and central "div" do not overlap perfectly. I picked up a color similar to the background of the button, in my situation it was quite simple.

As a result, we get a cross-browser “submit” button as in the example.

Sources
Demo

UPD. Added the reason why this method was chosen.