Ausrichtung im Formular: Button/Input
Stefan
- css
0 Morten0 tork um sorg0 MudGuard
Hallo zusammen,
ich bin gerade dabei ein Formular zu basteln, nun mein Problem:
direkt neben ein Input-Feld soll ein Button.
Dies funktioniert im IE recht gut, nur leider will der FF das so nicht aktzeptieren und setzt den button grundsätzlich unter das input feld, wenn die Größe des forms vorgegeben ist.....
hat mir hier evtl jemand einen Tipp, wo mein Fehler, oder der Bug des FF ist???
Danke schon einmal!!!
<style type="text/css">
form {
border:0;
margin:0;
padding:0;
height:22px;
width:131px;
}
input {
display:inline;
margin:0;
padding:0;
border:0;
background-color:yellow;
width:36px;
height:22px;
background-repeat:no-repeat;
}
button {
display:inline;
margin:0;
padding:0;
background-color:red;
border:0;
width:95px;
height:22px;
background-repeat:no-repeat;
}
</style>
<form>
<input type="text" value="23"></input>
<button>klicken</button>
</form>
Setz doch den Button auf position: absolute; und verschieb ihn dann mit margin so, dass er direkt neben dem input-Feld ist.
edit: grad getestet, position: absolute; reicht aus, um den Button neben dem Input zu positionieren. Sieht dann im IE und im FF eigentlich ganz in Ordnung aus ... ;)
Gruß,
Morten
hey
<style type="text/css">
form {
width:131px;
}
input {
width:36px;
}
button {
width:95px;
}
</style>
> ~~~html
> <form>
> <input type="text" value="23"></input>
> <button>klicken</button>
> </form>
>
ganz schön knapp kalkuliert!
da bleibt kein Platz für den white space, deinen Zeilenumbruch
so geht's besser (not tested)
<input type="text" value="23"></input><button>klicken</button>
mfg
Hi,
<input type="text" value="23"></input>
Abgesehen von tork's Lösung:
In HTML ist das </input> falsch.
In XHTML ist es zwar nicht falsch, aber es sollte, um auf HTML-Tag-Soup-Browser Rücksicht zu nehmen, besser als <input /> geschrieben werden.
cu,
Andreas