button div{
    width:16px;
    height:16px;
    background-image: url(images/ui-icons_d19405_256x240.png);
}

button div.leftImage{
    background-position: -96px -112px;
    float: left;
}

button div.rightImage{
    background-position: -64px -16px;
    float: right;
}

<button><div class="leftImage"></div><span>Button Text</span><div class="rightImage"></div></button>

button{
    margin: 0px;
    padding: 0px;
    font-family:Lucida Sans MS, Tahoma;
    font-size: 12px;
    color: #000;
    white-space:nowrap;
    width:auto;
    overflow:visible;
    height:28px;
}

button em{
    vertical-align:middle;
    margin:0 2px;
    display:inline-block;
    width:16px;
    height:16px;
    background-image: url(images/ui-icons_3d3d3d_256x240.png);
}

button em.leftImage{
    background-position: -96px -112px;
}

button em.rightImage{
    background-position: -64px -16px;
}

<button><em class="leftImage"></em>Button<em class='rightImage'></em></button>

button{
border:none;
background:none;
padding:0;
margin:0;
}

<button><div class="leftPic">&nbsp;</div><span>Button Text</span><div class="rightPic">&nbsp;</div></button>