5
Text-Textfeld-Text in einer Zeile - Textfeld soll Freiraum ausfüllen
Ich habe ein Div mit einer Breite von 510 Pixeln definiert. Innerhalb dieses Divs soll es jetzt eine Zeile geben, in dem vor einem Textfeld (input type=text) ein Text steht und dahinter auch. Der hintere Text soll am rechten Ende dieser Zeile stehen, der vordere am linken Ende, das Textfeld soll den Rest der Breite ausmachen.
Da ich schon jede Menge Varianten ausprobiert habe, bitte ich euch darum, mir eine Lösung mit komplettem Code zu geben. Ich habe zwar schon eine Lösung mit einer Tabelle, aber eigentlich wollte ich darauf verzichten.
Vielen Dank im Voraus
Melko's Sohn
So stelle ich mir das vor, das Blaue ist das übergeordnete Div:
Da ich schon jede Menge Varianten ausprobiert habe, bitte ich euch darum, mir eine Lösung mit komplettem Code zu geben. Ich habe zwar schon eine Lösung mit einer Tabelle, aber eigentlich wollte ich darauf verzichten.
Vielen Dank im Voraus
Melko's Sohn
So stelle ich mir das vor, das Blaue ist das übergeordnete Div:
Auf Facebook teilen
Auf Twitter teilen
Auf Reddit teilen
Auf Linkedin teilenBitte markiere auch die Kommentare, die zur Lösung des Beitrags beigetragen haben
Content-ID: 68906
Url: https://administrator.de/contentid/68906
Ausgedruckt am: 24.11.2024 um 16:11 Uhr
5 Kommentare
Neuester Kommentar
Hi Melko's Sohn,
könntest du vlllt. dein Vorhaben mit eine Bildchen (z.B. Paint) verdeutlichen?? Kann es mir nicht ganz vorstellen. Zuästzlich vllt. noch den Quellcodes Div's (512px) einstellen.
Grüße
Dani
könntest du vlllt. dein Vorhaben mit eine Bildchen (z.B. Paint) verdeutlichen?? Kann es mir nicht ganz vorstellen. Zuästzlich vllt. noch den Quellcodes Div's (512px) einstellen.
Grüße
Dani
Hallo Dani!
Vielen Dank für deine Antwort. Ein Bild habe ich in meinen ersten Eintrag gepackt, hier noch eines von den vielen Code-Beispielen, die ich inzwischen ausprobiert habe (bei dem allerdings noch fehlt, dass das Textfeld die größtmögliche Breite annimmt):
Auf die Spans kann ich meiner Meinung nach nicht verzichten, weil die beiden Texte verschieden eingefärbt werden sollen.
Vielen Dank für deine Antwort. Ein Bild habe ich in meinen ersten Eintrag gepackt, hier noch eines von den vielen Code-Beispielen, die ich inzwischen ausprobiert habe (bei dem allerdings noch fehlt, dass das Textfeld die größtmögliche Breite annimmt):
<div style="width:510px;">
<span style="float:left;">Text1</span>
<input type="text" style="float:left;" />
<span style="float:right;">Text2</span>
</div>Auf die Spans kann ich meiner Meinung nach nicht verzichten, weil die beiden Texte verschieden eingefärbt werden sollen.
So, ich hab es jetzt geschafft. Ein Div erfüllt in meinem Fall den selben Zweck wie ein Textfeld, der Rest ist mit CSS ganz einfach zu bewerkstelligen.
Grüße
Melko's Sohn
Grüße
Melko's Sohn
Moin!
Sry, dich habe ich total vergessen.
Kommt nicht mehr vor... *g*
Könntest du bitte noch den kompletten Quellcode poste, da die Nachwelt auch etwas davon haben soll.
Grüße
Dani
Sry, dich habe ich total vergessen.
Kommt nicht mehr vor... *g*Könntest du bitte noch den kompletten Quellcode poste, da die Nachwelt auch etwas davon haben soll.
Grüße
Dani
<div style="width:200px">
<div style="float:left;">Nummer1</div>
<div style="float:right;">Ende</div>
<div style="overflow:hidden;word-wrap:break-word;">Dasallesallesundnochvielmehrfülltallesaus</div>
</div>Das Interessante daran ist der Befehl word-wrap, den ich erst jetzt gefunden habe. Overflow trennt eigentlich ganze Worte nicht, mit word-wrap wird das möglich gemacht (getestet in den aktuellen Browsern IE, Opera und FF).
