Three part button markup and style

index.html

<!--
   Three part button
   http://jsfiddle.net/32GG3/1/
-->

<div class="blue-button-big">
  <div class="left-side"></div>
  <input type="submit" value="You may enter" class="center-side" />
  <div class="right-side"></div>
</div>

style.css

/* Three part button */

.blue-button-big {
  cursor: pointer;
  display: table;
  margin: 0;
  overflow: hidden;
  padding: 0;
}

.blue-button-big input,
.blue-button-big a {
  color: #FFF;
  font-weight: bold;
  font-size: 13px;
  font-family: Tahoma, Arial, Verdana;
  text-decoration: none;
  border: 0;
  margin: 0;
  cursor: pointer;
}

.blue-button-big .left-side { background: url( 'path to image with width 5px and height 26px' ) no-repeat scroll 0 0 transparent; }

.blue-button-big .center-side {
  background: url( 'path to image with width at least 1px and height 26px' ) repeat-x scroll top left transparent;
  float: left;
  height: 26px;
  line-height: 25px;
}

.blue-button-big .right-side { background: url( 'path to image with width 5px and height 26px' ) no-repeat scroll 0 0 transparent; }

.blue-button-big .left-side,
.blue-button-big .right-side {
  float: left;
  height: 26px;
  width: 5px;
}