CSS button via. 3 billeder.
Hej.Kan simpelthen ikke finde en løsning, og har søgt i en del tid på google, uden at finde noget der passer præcist.
Har lavet 3 små billeder, left, middle og right. Billedet middle har en bredde på 1px, så jeg blot i dokumentet, alt efter hvor meget tekst der står på knappen, så bliver billedet middle breddere.
Mit problem er så, at jeg ikke kan få koblet alle disse 3 billeder sammen. Jeg har prøvet med <img> til left og right, og CSS (Class) til selve knappen (Selve knappen laves med <input type="button">) Virkede så ikke.
Noget lignende:
.button_left {
hent-baggrunds-billede-left
width: 7px;
height: 18px;
}
.button_right {
hent-baggrunds-billede-right
width: 7px;
height: 18px;
}
.button {
hent-baggrunds-billede-midten
width: 1px;
height: 18px;
border: 0px;
}
Når jeg så vil have det udskrevet, får jeg det simpelthen ikke til at se ordenligt ud. F.eks:
<div class="button_left"></div><input type="button" class="button" value="Tekst her"><div class="button_right"></div>
Det virker ik, det kommer ik til at stå på samme linie. Bruger jeg så nogt float: left, virker det heller ikke, da selve knappen laves via <input> og ikke er inde for noget <div>.
At bruge <span> fremfor <div> går ikke, da der så skal indhold til, og jeg kan ikke vide hvilke skærmstørrelser og browsere andre har, og det fucker også linien op, hvis jeg f.eks indtaster indenfor hver <span> så.
Nogle ideer?
