Text runt bild

Hur ska jag göra för att få bilden att lägga sig till höger i diven "content" så att texten "flyter runt"? Tar jag bort "position:absolute" på bilden funkar det, men nu måste jag av vissa anledningar ha så. Något CSS-proffs som vet hur jag ska göra? :)

<div id="content" style="width:500px; background-color:#CCC">

<div style="float:right"><p><img src=bilder/bild.gif" style="position:absolute" /></p></div>

<p>Text text text text text text text text text text text text text text text text text text text text text text text text</p>
<p>Text text text text text text text text text text text text text text text text text text text text text text text text</p>
<p>Text text text text text text text text text text text text text text text text text text text text text text text text</p>

</div>

Nu lägger sig bilden utanför diven "content".

Tja, webbläsaren undrar förstås vad du menar med "position:absolute", dvs position i förhållande till vad? :)

En position ska specifieras med värden för "left", "right", "top" och "bottom" där minst ett horisontellt och ett vågrätt mått måste anges. Exempelvis "left:0px" och "top:0px" placerar boxen i det övre vänstra hörnet av webbläsarens fönster.

Men att ha bilden inne i en div som har "float:right" och sedan absolut positionera bilden verkar konstigt. :? Vad är orsaken till att du måste ha det så? Duger det inte med skippa det ena och float'a (eller positionera) det andra?

DIVen flyter till höger, och bilden är absolut positionerad. DIVen påverkas då inte bilden, så DIVen får det beräknade värdet 0 på 'height'. Du får antingen skippa position:absolute eller ange mått på DIVen.

Det finns ingenting som säger att man "måste" ange 'left', 'top' osv när man använder position:absolute.

zcorpan skrev:

Det finns ingenting som säger att man "måste" ange 'left', 'top' osv när man använder position:absolute.

Det må vara riktigt att W3C inte uttryckligen säger att man måste ange 'left', 'top' osv, men det finns andra som nämner det och i alla exempel jag sett hos såväl W3C som hos andra är positionen specificerad. W3C Schools skriver också att

With a value of 'absolute' the element can be placed anywhere on a page. The element's position is specified with the 'left', 'top', 'right', and 'bottom' properties

Jag har ännu inte heller sett något exempel någonstans där "position:absolute" används utan att man specificerat positionen. Jag undrar också hur man ska få ett objekt absolut positionerad där man vill ha den, om man inte specificerar var den ska positioneras?

Mozfan skrev:

Det må vara riktigt att W3C inte uttryckligen säger att man måste ange 'left', 'top' osv, men det finns andra som nämner det

Det enda som är normativt är specen. Om någon säger nånting som inte stämmer överrens med specen har den personen fel och specen rätt.

Mozfan skrev:

Jag har ännu inte heller sett något exempel någonstans där "position:absolute" används utan att man specificerat positionen.

Jag använder det ibland om det enda jag vill är att få bort elementet ur dokumentflödet.

Mozfan skrev:

Jag undrar också hur man ska få ett objekt absolut positionerad där man vill ha den, om man inte specificerar var den ska positioneras?

Den hamnar där den skulle ha hamnat om den inte var positioerad.

Hmm...

Här är annars en intressant artikel om hur man kan få text att flyta runt bilder... ;)

zcorpan skrev:

Det enda som är normativt är specen. Om någon säger nånting som inte stämmer överrens med specen har den personen fel och specen rätt. Jag använder det ibland om det enda jag vill är att få bort elementet ur dokumentflödet.Den hamnar där den skulle ha hamnat om den inte var positioerad.

Ja, det är alltså "valid" att använda "position:absolute" utan att ange var den ska positioneras. Men som du säger, anger man ingen position så hamnar elementet där den ändå skulle hamna utan positionering och att använda positionering på det sättet är väl mestadels ganska "menlöst". :q Nog är väl positionering avsedd att användas när man vill ha ett element på en annan position än den där den annars hamnar i det normala flödet. :)

Hmm...
Finns inget som säger att position:absolute "är avsett" för det ena eller det andra (iallafall inte i den hårda meningen att man bör undvika det - dvs i till skillnad mot t.ex. tabeller som uttryckligen "inte är avsedda" för layout)

Se det som att en position: absolute utan att ange någon som helst koordinat innebär en ompositionering av ett block i z-led (dvs till en position "ovanför" den position där blocket råkar stå i koden i z-led)... Vilket kan vara praktiskt - som zcorpan påpekade - oavsett om man anger koordinater i x-y-planet eller ej ;)