webForumDet fria alternativet

Ta bort objekt från "flowen"?

4 svar · 333 visningar · startad av Kenchu

KenchuMedlem sedan apr. 2004113 inlägg
#1

Jag har en bild på en hemsida. Jag vill att det bakom denna bild, och längs med hela sidans höjd, skall gå ett streck, som har en position relativ till bildens. Men hur skall jag göra detta? För, jag kan ju inte... :

  • göra streckets position relativ, för då tas den med i sidans flow (och således placeras strecket inte bakom bilden)
  • göra streckets position absolut, för då är positionen inte relativ till bildens (dock är strecket inte med i flowen, vilket jag vill).
  • göra strecket till en bakgrundsbild till bilden, till body eller något annat, för då kommer man inte kunna:
    (om body) placera bilden
    (om bilden) repetera bilden i y-led utöver bildens höjd
    (om objekt) kunna placera objektet bakom bilden.

Så, vad jag vill är alltså:

att ta bort strecket från flowen, men fortfarande kunna placera det relativt till en bild.

Här nedan har jag en bild som ett komplement till förklaringen:

http://web.telia.com/~u87309837/forum/exempel.gif

Jättetacksam för svar!

tantenMedlem sedan nov. 20051 596 inlägg
#2

Det första jag tänker på när jag ser det du vill är att ha strecket som bakgrundsbild i en egen div. Och sedan använda minusmarginaler på sådant som ska lägga sig över...

KenchuMedlem sedan apr. 2004113 inlägg
#3

Men hur ska jag lyckas placera ut bilden bakom huvudbilden, när div:en måste ha position: relative? Samt, så fort man har relative så får man ju inte bestämma längre hur hög div:en ska vara. Endast när man har position: absolute (och kanske fixed, jag vet inte) så får man ha exempelvis height: 100%.

tantenMedlem sedan nov. 20051 596 inlägg
#4

så här ugefär tänkte jag

#svart{ background-color: #000; width: 50px; height: 300px; float: left;}
#bild{ position: absolute; top: 60px }

och

<div id="svart">
<div id="bild"><img src="katter.jpg" width="150" height="110" /> </div></div>

Men som sagt lite svårt att säga precis med så lite kod... skickar med en bild

Image1.jpg
KenchuMedlem sedan apr. 2004113 inlägg
#5

Men ok, vi gör såhär då:

http://web.telia.com/~u87309837/t/

Där har du sidan som den ser ut för tillfället. Hur ska jag göra för att få det blåa strecket att hamna under det gråa, och fortsätta ner till sidans slut? Obs att innehållet på sidan (förutom det blåa strecket, som är problemet) flyttar på sig om man exempelvis resizear fönstret.

126 ms totalt · 3 externa anrop · v20260731065814-full.30151723
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
123 ms — hämta tråd, inlägg och bilagor (db)