float (Textumfluss) mit positioniertem Bild
Adrian
- css
0 Cheatah0 Felix Riesterer0 MudGuard
Hallo zusammen
Ich habe folgendes Problem, ich möchte rechts ein Bild poisitionieren, welches links von nem text umgeben ist der unten weiter geht. (siehe für eine Ansicht http://www.spaargaren.ch/willem/neu/index.html --> TEAM (nicht versuchsobjekt!!!)) aber irgend wie funktioniert das mit relativ positionierten Ramen nicht.
meine Versuche die Seite ohne innere Tabelle zu machen schlugen alle fehl.
Versucht1:
<div style="position:relative; border:solid; top:0px; right:0px; width:630px; height:520px; overflow:hidden;">
<div style="position:absolute; top:0px; right:0px; height:240px; width:320px; float:right;">
<img border="0" src="templates/spaargaren/images/raumplanung.jpg" /></div>
</div>
Problem: Nachfolgender Text ist darunterliegend und nicht float:right
Versucht2:
<div style="position:relative; border:solid; top:0px; right:0px; width:630px; height:520px; overflow:hidden;">
<div style="position:relative; top:0px; right:0px; height:240px; width:320px; float:right;">
<img border="0" src="templates/spaargaren/images/raumplanung.jpg" /></div>
</div>
Problem: Nachfolgender Text ist zwar daneben, position stimmt aber erst wenn soviel text vorhanden ist, dass höhe des inneren ramens erreicht wird. Einfach ein transparentes image daneben zu setzen geht auch nicht und nen weiteren leeren 1 pixel hohen und 300px-breiten div-block auch nicht.
Guter Rat ist gefragt... Vielen Dank für eure Mühe.
Hi,
<img border="0" src="templates/spaargaren/images/raumplanung.jpg" />
ERROR: Required attribute "alt" missing.
Problem: Nachfolgender Text ist darunterliegend und nicht float:right
Natürlich, das Element ist schließlich absolut positioniert.
Problem: Nachfolgender Text ist zwar daneben, position stimmt aber erst wenn soviel text vorhanden ist, dass höhe des inneren ramens erreicht wird.
Das Problem wurde erst heute früh mit einem zwar nicht aussagekräftigen, aber dennoch gut auffindbaren Subject diskursiert.
Guter Rat ist gefragt...
Was bezweckst Du eigentlich mit den vielen position:relative?
Cheatah
Was bezweckst Du eigentlich mit den vielen position:relative?
Schreib gerade die ganze seite um (ohne Frames, mit tabelle), also habe ich links und oben das menü und im contentbereich hab ich dann eben nen grösseren ramen gemacht, den ersten mit width:630px; height:520px; overflow:hidden; damit der text falls er zu lange ist nicht das layout zerstört usw. weil die benutzer diesen nachher über ein cms eingeben können, aber egal.
so nun habe ich also das textfeld und will darin eben mit der positionierung spielen.
der thread von heute morgen hilft mir ehrlich gesagt nicht viel, kann ja nicht den float auf den text markieren, da dieser in L-Form um das Bild gehen muss.
Heisst das nun es gibt keine schlaue Lösung?
Hi,
Schreib gerade die ganze seite um (ohne Frames, mit tabelle),
warum betonst Du die Tabelle?
der thread von heute morgen hilft mir ehrlich gesagt nicht viel, kann ja nicht den float auf den text markieren, da dieser in L-Form um das Bild gehen muss.
Davon, den Text zu floaten, war auch nicht die Rede.
Cheatah
Hi,
warum betonst Du die Tabelle?
Wollte nur erklähen was ich machen will. Ganzes design von Frames auf Tabelle umstellen. eigentlich nicht wichtig.
Davon, den Text zu floaten, war auch nicht die Rede.
dann hab ich nicht verstanden was ich nun ausprobierne soll. Tipp?
warum betonst Du die Tabelle?
Wollte nur erklähen was ich machen will. Ganzes design von Frames auf Tabelle umstellen. eigentlich nicht wichtig.
Insofern nicht wichtig, als dass es sinnfrei ist. Weder kann man Frames mit Tabellen ersetzen, noch macht es Sinn, Tabellen zum Layout zu missbrauchen.
Davon, den Text zu floaten, war auch nicht die Rede.
dann hab ich nicht verstanden was ich nun ausprobierne soll. Tipp?
Dreh die Aussage um. Wenn nicht der Text gefloatet werden soll...
Liebe(r) Adrian,
Ich habe folgendes Problem, ich möchte rechts ein Bild poisitionieren, welches links von nem text umgeben ist der unten weiter geht.
aha... also ein <p><img src="..." alt="..." style="float: right;" />Hier der Fließtext...</p>
<div style="position:absolute; top:0px; right:0px; height:240px; width:320px; float:right;">
Widersprechen sich "position: absolute" und "float:right" nicht gegenseitig?
Problem: Nachfolgender Text ist zwar daneben, position stimmt aber erst wenn soviel text vorhanden ist, dass höhe des inneren ramens erreicht wird.
Was willst Du damit sagen? Wenn in einem Fließtext ein Bild vorkommt, dann ist es zunächst mal ein inline-Element. Wenn Du es per "float" aus dem Fluss herausnimmst, dann verhält sich der Fließtext an sich weiterhin so, als ob nichts gewesen wäre. Sollte das Bild dem Fließtext "im Weg sein", so fließt er halt drumherum. Und genau das solltest Du ihn auch ungestört tun lassen, anstatt ihn mit irgendwelchen "position: relative"-Angaben darin zu stören!
Liebe Grüße aus Ellwangen,
Felix Riesterer.
Hi,
<div style="position:absolute; top:0px; right:0px; height:240px; width:320px; float:right;">
Widersprechen sich "position: absolute" und "float:right" nicht gegenseitig?
Nicht wirklich:
2. Otherwise, 'position' has the value 'absolute' or 'fixed', 'display' is set to 'block' and 'float' is set to 'none'.
(http://www.w3.org/TR/REC-CSS2/visuren.html#q24)
Wenn also position:absolute gesetzt ist, kann man bei float angeben, was man will, es wird mit "none" überbügelt.
cu,
Andreas
Lieber Andreas,
Wenn also position:absolute gesetzt ist, kann man bei float angeben, was man will, es wird mit "none" überbügelt.
Daraus folgere ich für mich: "position:absolute" und "float:right" widersprechen sich vom Konzept her, aber Browser interpretieren in diesem Falle (gemäß W3C-Spezifikation) die float-Anweisung als "float:none", so dass der Widerspruch (scheinbar) aufgelöst wird. MERKE: position ist stärker als float.
Liebe Grüße aus Ellwangen,
Felix Riesterer.
jep genau dran liegts. Das CMS das ich einsetze (mamboserver) macht mir noch nen div tag um meinen divtag und der überdeckt dann ganz nett mein float.
vielen dank für eure Hilfe.
Gruss aus Zürich
Adrian