Esta es la web para poder visualizarla.
http://desarrollo-app.webcindario.com/css2/page.html
Lo que quiero y no he conseguido tras mucho tiempo con dreamweaver es que los botones de arriba a la izquierda (BOTON 1, BOTON DOS Y BOTON NUMBER TRES) mantengan la misma anchura independientemente del texto que se les ponga.
Gracias de antemano.
Un saludo.
Este es el CSS
Código HTML:
.Button .btn { position: relative; overflow: hidden; display: block; width: auto; z-index: 0; height: 20px; color: #ECEEEF; white-space: nowrap; float: left; } .Button .t { height:20px; white-space: normal; padding: 0 50px; font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif; font-size: 10px; font-style: normal; font-weight: bold; text-transform: uppercase; text-align: left; line-height: 20px; text-decoration: none !important; } input, select { font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif; font-size: 10px; font-style: normal; font-weight: bold; text-transform: uppercase; } .Button .active { color: #E9EFF2; } .Button .hover, a.Button:hover { color: #F1F6F8; text-decoration: none !important; } .Button .active .r { top: -40px; } .Button .hover .r { top: -20px; } .Button .r { display: block; position: absolute; overflow: hidden; z-index: -1; top: 0; right: 0; width: 2px; height: 60px; } .Button .r span { display: block; position: absolute; overflow: hidden; z-index: -1; top: 0; right: 0; width:405px; height: 60px; } .Button .active .l { top: -40px; } .Button .hover .l { top: -20px; } .Button .l { display: block; position: absolute; overflow: hidden; z-index: -1; top: 0; left: 0; right: 2px; height: 60px; } .Button .l, .Button .r span { background-image: url('images/Button.png'); } /* end Button */
Código HTML:
<div><form method="get" id="newsletterform" action="javascript:void(0)"> <input type="text" value="" name="email" id="s" style="width: 95%;" /> <button class="Button" type="submit" name="search"> <span class="btn"> <span class="t">Boton 1</span> <span class="r"><span></span></span> <span class="l"></span> </span> </button> <button class="Button" type="submit" name="search"> <span class="btn"> <span class="t">Boton dos</span> <span class="r"><span></span></span> <span class="l"></span> </span> </button> <button class="Button" type="submit" name="search"> <span class="btn"> <span class="t">Y boton number 3</span> <span class="r"><span></span></span> <span class="l"></span> </span> </button> </form></div> </div>