Hvordan plassere bakgrunnsbilde relativt i en div?

[Crossfire]

Jeg prøver å plassere et lite bakgrunnsbilde som skal henge med mens man scroller inne i en div. Dette i seg selv går forsåvidt bra, men problemet er at bildet blir plassert relativt til hele skjermbildet, og ikke til div'en. Dette fører til at når man resizer vinduet eller ser siden på forskjellige skjermer blir bildet forskjellig plassert.. Hvordan kan jeg ordne dette - skulle tro det var mulig?

[pian]

du kan jo plassere div'en fixed ifht skjermen.

ellers høres det merkelig ut at bakgrunnen plasseres relativt...? kan du ikke sette background-image på div'en da? da er den jo uansett plassert riktig.

[Crossfire]

Det er et lite bilde som skal være i bakgrunnen oppe i høyre hjørne i div'en, det dekker ikke hele området...

[Ståle]

background-attachment: fixed;

 

?

[Crossfire]

Bruker det, det gjør jo så bildet scroller med siden, men det gjør ingenting med plasseringa

[Ståle]

kan du tegne noe? Skjonte egentlig ikke helt spm.

[pakke]

Hvis jeg ikke misforstår nå så ønsker du å ha div2 inni div1, der div2 skal plassere seg i et hjørne av div1 uansett hvor denne befinner seg?

 

En løsning på dette er å gi div1 position:relative; og div2 position:absolute; -da kan du posisjonere div2 relativt til div1 i stedet for til browservinduet.

 

F.eks slik:

 

css:

.div1 {
position:relative;
}

.div2 {
position:absolute;
top:5px;
}

 

markup:

<div class="div1">
   <div class="div2">bla bla</div>
   <p>annet innhold i div1</p>
</div>

[Crossfire]

Takk for svar. Tror du misforstod litt dessverre. Har brukt mine paint skills for å prøve å forklare igjen:

[Moonshine]

background-attachment:fixed

 

http://www.htmldog.com/reference/cssproper...und-attachment/

[Crossfire]

Tror nesten jeg skal lage en video av hva jeg mener Background attachment fixed er greit nok, men bildet forandret uansett posisjon når jeg resizer vinduet.

[Moonshine]

Hva er det du snakker om?

 

http://w3schools.com/css/tryit.asp?filenam...ound-attachment

 

(Bruker du IE er det greit nok, den støtter ikke propertien)

[Crossfire]

Ok nå har jeg faktisk tatt det opp på film. Dårlig oppløsning men man kan se poenget mitt forhåpentligvis. Altså - scrolling virker, forskjellige vindusstørrelser virker ikke.

Endret 10. oktober 2007 av Crossfire

[Moonshine]

Film hjelper ikke i det hele tatt. Få se koden.

[pvp]

Høres ut som det er litt rar kode+css kombinasjon ute og går. Vi må nok få se litt kode ja.

 

For å få et bilde til å henge slik du beskriver trenger du kun dette:

 

.div2 {

background-image:url(path/filename);

background-position:top left;

background-attachment:fixed;

background-repeat:no-repeat;

}

 

Du kan lage marg med å sette inn "margin" i css'en eller å redigere bildet selvsagt.