Gå til innhold

Repitere bilde 100% ned?


Gjest medlem-77217

Anbefalte innlegg

Gjest medlem-77217

Hei sann! Jeg kommer alltid på et problem når jeg lager design. Når jeg skal få et bilde til å repitere seg nedover siden, går det fint. Men problemet som kommer da, er at det siste bilde i repitasjonen vil ikke repitere seg 100%!

 

Bilde:

 

|header-|

|---------|

| |

|---------|

| |

|---------|

| |

|---------|

| |

|---------| <---- Vil ikke repitere seg som de andre bildene!

|FOOTER|

 

 

 

-Takker for svar.

Lenke til kommentar
Videoannonse
Annonse

Dette kommer av at det vanligvis ikke skal settes høyde i html. Grunnen er at hvis man forandrer tekststørrelse, vil høyden forskyve seg. Et bakgrunnsbilde ligger innen et definert område. Og hvis området er akkurat like høyt som bildet, vil det bli som du vil ha det. Det kan eventuelt være bedre å lage hele bakgrunnen (tar ofte mye plass), eller å sette bakgrunnen der du vil ha den. For eksempel inne i en <div>. :)

Lenke til kommentar

Hehe, beklager litt knotete forklaring..

 

Dersom du vil ha repetert det siste bildet hundre prosent, er du nødt til å vite høyden på siden. Eller området du vil ha bakgrunnsbildet i. Her vil du ha bildet fem ganger repetert hundre prosent. Dersom bildet er 200 px høyt, sitter du igjen med en høyde på 1000 px. Så langt, alt vel.

 

Men det er ikke nødvendigvis en enkel sak å angi høyde i html. Og ofte, lite fornuftig. Så derfor er det ofte bedre å løse problemet på andre måter. Eventuelt å lage bakgrunnen annerledes, eller å bruke dette bakgrunnsbildet i elementer du kan sette høyde på.

Lenke til kommentar

ok, jeg sliter skikkelig med å forstå problemet her...

 

Er det slik at du har repetert et bilde nedover siden, et bilde som har f.eks høyde 200px, og at det da blir kuttet helt nederst på siden? Og at du ønsker å unngå at bildet blir kuttet?

 

Eller har du problemer med å få bildet til å repetere seg helt ned, altså at det er områder på siden hvor bildet ikke vises i det hele tatt?

 

---

 

Hvis du har problem nr 1 er du nødt til å sette høyden på siden/diven til et tall som er delig på høyden til bildet (hvis bildet er 200px høyt, må diven være 200,400,600,800,.......2000,2200 osv). På den måten kan bildet repeteres uten at det kuttes. Problemet her er at du kanskje har ulik lengde på innhold i denne div'en? Da blir det ikke så lett...

 

Problem 2: har man ikke nok innhold til at siden strekkes helt ned, og man har satt "background:#FFF img("bilde.jpg") repeat-y;" på body/html, kan et tips være å tilføre height:100%; (eventuelt min-height:100%;)

Lenke til kommentar
Gjest medlem-77217

Det er problem nummer 1 jeg sliter med Qualbeen. Men det jeg også vil, er at siden blir lengre når teksten er lang. Altså, at siden er like lang som teksten. Og da at den ikke kutter seg selv på slutten, men fullfører bilde.

Lenke til kommentar

css-koden for bakgrunn på hele siden er

body {
 background:  url(./bilde.png) repeat;
}

 

Ønsker du kun bakgrunn på deler av siden, putter du ønsket tekst inn i en div, og legger til css-koden (altså bytte ut "body" med "din-div-her" i koden ovenfor).

 

Ulike div-er kan fint ha ulik bakgrunn, og hvis man har satt en egenskap på en div til noe, kan man fint endre på denne lenger nede i css-dokumentet. Det er siste skrevne regel som gjelder.

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...