# Rundes Eingabefeld



## neuni (28. Dezember 2004)

Hi,
 ihr kennt doch bestimmt die Eingabefelder die man mit <input type="text"> erzeugt. 
 Das is ja jetzt immer eckig. Kann man das irgendwie rund bekommen? Also abgerundete Ecken meine ich.

 Danke schonmal für eure Antworten!


----------



## MCIglo (28. Dezember 2004)

Die Felder selbst nicht, aber du könntest das vlt. mit Hilfe von Bildchen so aussehen lassen.


----------



## Gumbo (28. Dezember 2004)

Ab CSS3 wird es möglich sein, die Grenzen abgerundet darzustellen.
Bis die gängigsten Browser dies jedoch interpretieren wirst du wohl auf die Mozilla-Pseudo-CSS-Eigenschaft -moz-border-radius bzw. eine Lösung durch Hintergrundgrafiken zurückgreifen müssen.


----------



## neuni (29. Dezember 2004)

Wie könnte man das den mit Grafiken machen? Weil ich müsste ja irgendwie die Grafik über das Eingabefeld legen!


----------



## MCIglo (29. Dezember 2004)

Nein. einen Halbkreis links vom Feld und einen rechts.
([_____])
In etwa


----------



## Julian Maicher (29. Dezember 2004)

Naja, ob man das so hinbekommt, dass es gut aussieht bezweifel ich stark.
Ich würde, wenn überhaupt, ein Bild komplett in den Hintergrund des Input-Feldes legen und den Abstand nach Rechts und Links jeweils ein wenig höher machen, da du sonst in der Rundung schreiben könntest, was sehr unschön ist.


----------



## neuni (29. Dezember 2004)

Gut, aber wie bekomme ich das Bild hinter das EIngabefeld? Man könnte das ja mit nem div machen, aber dann müsste man top und left angeben und meine Seite wäre nicht mehr mittig


----------



## chpa (29. Dezember 2004)

Da könntest du zum Beispiel ein <TD> Tag nehmen und da ein Hintergrundbild einfügen.


----------



## Budman (29. Dezember 2004)

Oder einfach nur dem input ein background-image per CSS verpassen. 


```
<input style="background-image:url(...);" ...>
```

Mit margin bzw padding bekommst Du auch noch die richtige Position hin!

Gruss


----------



## neuni (29. Dezember 2004)

Budman hat gesagt.:
			
		

> Oder einfach nur dem input ein background-image per CSS verpassen.
> 
> 
> ```
> ...



Dann ist die Grafik aber in dem eckigen Edit drinne :-/


----------



## dermacz (29. Dezember 2004)

Mach die borders aus wenn ich deinen Fehler richtig verstanden habe


----------



## Budman (29. Dezember 2004)

So isses! Du musst natürlich die Border auf 0px setzen, sonst hast Du den eckigen Rahmen aussenrum immer noch! Evtl noch die Farbe des Feldes (also die background-color) anpassen.

Gruss


----------



## neuni (29. Dezember 2004)

border:none schon gings 

Danke an alle!


----------



## Budman (29. Dezember 2004)

Gern geschehen, lass mal sehen wenn's fertig ist


----------



## neuni (30. Dezember 2004)

Das runde Eingabefeld ist fertig...aber die Pgae, da müsst ihr noch warten...

http://web223.server-drome.net/tutorials/box_rund/box.php  <-- da ist schonmal das Eingabefeld zu sehen!


----------



## danube (30. Dezember 2004)

Sieht unter Mozilla ganz gut aus, ironischerweise kann der Explorer es nicht richtig anzeigen


----------



## MCIglo (30. Dezember 2004)

Kann der IE überhaupt was richtig machen, außer Malware verbreiten?


----------



## neuni (2. Januar 2005)

Ich hasse den IE...ich glaube ich sperre IE-Benutzer einfach für meine Seite


----------



## Consti (2. Januar 2005)

Opera machts auch falsch. Man sieht dort noch die Borders von dem Feld. Würde sagen, dass man die am besten mit CSS wegformatieren sollte.


```
CSS
.form-box
{
border:0px solid #FFFFFF
}
```

und dann halt als Klasse einbinden!


----------

