基本のHtmlはこれ
[div class="cute2-button">
[button>(￣￣￣∧￣￣￣)えっへん! [/div]

CSSはこんな感じ。
.cute2-button {
background: url(Images/safari-left.png) no-repeat 0 0;
height: 24px;
margin: 3em auto 2.5em 1em;
padding: 0 0 0 12px;
display: inline-block;
display: -moz-inline-box;
zoom: 1; *display: inline;
}
.cute2-reply { margin: 1em auto 4em 4em; }
.cute2-button button {
background: url(Images/safari-right.png) no-repeat 100% 0;
height: 24px; line-height: 24px;
cursor: pointer;
display: block;
padding: 0 12px 0 0;
margin: 0;
border: none;
overflow: visible;
font: 500 13px Trebuchet MS, Tahoma, 'ヒラギノ丸ゴ Pro W4', 'メイリオ', Arial, sans-serif;
}
* html .cute2-button { overflow-y: hidden; width: 1%;} /* for IE6... */
* html .cute2-button button { width: 1%;} /* for IE6... */

.cute2-button:hover {
background-position: 0 50%;
}
.cute2-button:hover button {
background-position: 100% 50%;
}
.cute2-button:active {
background-position: 0 100%;
}
.cute2-button:active button {
background-position: 100% 100%;
}

.cute2-button button[disabled] {
color: #aaa;
}
/*
.cute2-button button {
*behavior: expression(
(function(o){
if(o.disabled) return;
if(typeof cute_mdown == 'undefined'){
if(o.disabled) return;
cute_mover = function(){
this.style.backgroundPosition = '100% 50%';
this.parentNode.style.backgroundPosition = '0 50%';
}
cute_mdown = function(){
this.style.backgroundPosition = '100% 100%';
this.parentNode.style.backgroundPosition = '0 100%';
this.parentNode.style.overflowY = 'visible';
}
cute_mup = function(){
this.style.backgroundPosition = '100% 0';
this.parentNode.style.backgroundPosition = '0 0';
if(!window.XMLHttpRequest) this.parentNode.style.overflowY = 'hidden';
}
}
o.runtimeStyle.behavior = 'none';
o.onmouseover = cute_mover;
o.onmousedown = cute_mdown;
o.onmouseup = o.onmouseout = cute_mup;
})(this)
);
}*/
.cute2-button button:focus::-moz-focus-inner { border-color: transparent !important; }