tabellenalternative links rechts ohne float

[Tommy]

Moin,
was muss ich machen wenn ich auf gleicher Höhe etwas
sowohl rechts als auch links anordnen möchte?

Links  = Text
Rechts = Button

Float scheidet aus, weil trotz clear, das Ganze
nie sauber funktioniert.

In einer Tabelle würde ich das so machen:

<table width="80%" border="1">
<tr>
<td align="left">irgendwas bla bla....</td>
<td align="right"><input type="button" value="test"></td>
</tr>
</tabel>

-----------------------------------
| blabla....       |     ||button||
-----------------------------------

Aber in css bekomme ich das nicht sauber hin:
Mit sauber meine ich, keine wirre divitis gekoppelt mit
float. Position habe ich auch probiert, aber relative
macht gar nichts und absolute schießt übers ziel hinaus.

Aber es kann doch nicht so kompliziert sein, oder?

Tommy

[Professor Hase]

Hi!

was muss ich machen wenn ich auf gleicher Höhe etwas
sowohl rechts als auch links anordnen möchte?
Float scheidet aus, weil trotz clear, das Ganze
nie sauber funktioniert.

Was muß ich machen, wenn ich in Moskau die Menschen verstehen will? Russisch lernen scheidet aus, weil das Ganze nie sauber funktioniert.

Du kannst Dich entweder _dieser_ Logik anschließen und somit mit Tabellen, Frames oder was auch immer arbeiten ... oder Du machst das, was Sinn dieser Seiten ist, nämlich die richtige und konsequente Verwendung von html und CSS.

Mit sauber meine ich, keine wirre divitis gekoppelt mit
float.

Wieso wirre divs? Du brauchst exakt 2 divs. Eines floatest Du left, das andere bekommt die Breite des ersten als margin-left verpaßt. Und das wars auch schon.

mfg

Professor Hase

[Tommy]

Was muß ich machen, wenn ich in Moskau die Menschen verstehen will? Russisch lernen scheidet aus, weil das Ganze nie sauber funktioniert.

Also im normalen Umgangston, meinst du wohl: ohne float gehts nicht?

Mit sauber meine ich, keine wirre divitis gekoppelt mit
float.

Wieso wirre divs? Du brauchst exakt 2 divs. Eines floatest Du left, das andere bekommt die Breite des ersten als margin-left verpaßt. Und das wars auch schon.

Extra Div für Clear nicht zu vergessen.

Ja, nur das das ganze eh schon in Divs subdivs usw...
ist, so dachte ich das ganze lässt sich irgendwie mit
Inlineelementen bewerkstelligen.

Die Inhalte und styleclassen sind sehr dynamisch, was eine
Float Prodzedur schwierig macht, aber wenn es nach deiner meinung nicht anders geht, dann erst mal danke.

Tommy

[Harlequin]

Yerf!

Position habe ich auch probiert, aber relative
macht gar nichts und absolute schießt übers ziel hinaus.

Vermutlich, weil position:absolut den falschen Bezugspunkt hatte. Gib dem umgebenden Element mal ein position:relativ mit...

Gruß,

Harlequin

[Tommy]

Hallo Harlequin,

macht gar nichts und absolute schießt übers ziel hinaus.

Vermutlich, weil position:absolut den falschen Bezugspunkt hatte. Gib dem umgebenden Element mal ein position:relativ mit...

der Hinweis war super, und funktioniert, danke.

Aber ist das auch W3C konform oder eine Art Hack/Workaround?
Dachte bisher immer, dass position:absolute überhaubt keine
Bezugspunkte kennt und somit die völlige Positionsfreiheit geniesst
und sich an keinerlei Elternelemente orientiert.

Gruss & Dank
Tommy

[Harlequin]

Yerf!

Aber ist das auch W3C konform oder eine Art Hack/Workaround?
Dachte bisher immer, dass position:absolute überhaubt keine
Bezugspunkte kennt und somit die völlige Positionsfreiheit geniesst
und sich an keinerlei Elternelemente orientiert.

Das ist ein beabsichtigte Verhalten und wird auch hier in SelfHTML im Artikel über position:absolut erwähnt. Vorsichtig sollte man damit nur bei Tabellen sein (das Verhalten von position:relativ bei Tabellenelementen ist undefiniert).

Gruß,

Harlequin

[Detlef G.]

Hallo Tommy

was muss ich machen wenn ich auf gleicher Höhe etwas
sowohl rechts als auch links anordnen möchte?

Links  = Text
Rechts = Button

Einfaches Beispiel:

CSS:

#wasPassendes{  
  width:80%;  
  border:4px double #000;  
  text-align:left;  
}  
#wasPassendes input{  
  float:right;  
}  

HTML:

<div id="wasPassendes">  
  <input type="button" value="test">  
  irgendwas bla bla....  
</div>  

Allerdings noch dafür sorgen, dass das Div immer mindestens so hoch wie der Button ist.

Auf Wiederlesen
Detlef