CSS Achtergrond probleem

Door Onbekende gebruiker op 15-12-2005 19:47

1.284 views

Hoi,

Ik heb een probleem met het tonen van mijn pagina in FireFox. Wellicht kunnen jullie helpen.
De inhoud van mijn html-pagina:

<HTML>
<HEAD>
<TITLE>blabla</TITLE>
<LINK REL="stylesheet" HREF="images/style.css">
</HEAD>

<BODY>
<DIV ID="container-page">
BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA 
BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA 
BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA 
BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA 
BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA BLABLA 
</DIV>
</BODY>
</HTML>

De CSS is als volgt:
#container-page {
margin: 0 auto;
width: 700px;
background: url(back-page.gif) repeat-y;
text-align: center;
position: relative;
height: 100%;
}

De CSS toont dus een achtergrond plaatje.
Als ik mijn pagina in Internet Explorer open, wordt het plaatje tot geheel onderaan doorgetrokken. Echter in firefox, op het moment dat ik naar beneden scroll, zie ik het achtergrond plaatje niet meer.
Het lijkt er op alsof de hoogte van de achtergrond (100%) alleen het zichtbare deel bestrijkt.

Iemand enig idee hoe ik dit kan fixen zodat het er normaal uitziet in FF??

thx
Joost

Steff an

15-12-2005 20:02

Volgens mij gaat bij Firefox 'height: 100%; ' echt maar 100% de body wat je in 1 keer kan zien en Internet explorer 100% van het document.

Onbekende gebruiker

15-12-2005 20:02

Geen andere mogelijkheden dan???

Jan Koehoorn

15-12-2005 20:12

Hoi Joost,

wat moet het plaatje precies doen? Zichzelf herhalen over de hele div, of zich herhalen over de hele pagina? Heb je een link?

Onbekende gebruiker

15-12-2005 20:24

Hoi Jan,

Een voorbeeld is hier te vinden: http://www.dutchville.com/test

Als je naar beneden scroll houdt de image niet aan...

Alvast bedankt voor de hulp!!

Onbekende gebruiker

15-12-2005 20:25

By the way: Bij internet explorer loopt hij wel gewoon door. Betreft dus echt alleen firefox...

Jan Koehoorn

15-12-2005 20:28

Verander je CSS eens in:

#container-page {
margin: 0 auto;
width: 700px;
background: url(back-page.gif) center center repeat-y;
text-align: center;
}

Jan Koehoorn

15-12-2005 20:29

Joost schreef op 15.12.2005 20:25
By the way: Bij internet explorer loopt hij wel gewoon door. Betreft dus echt alleen firefox...

Ja ik zag het. Je gebruikt een CSS shorthand die volgens mij niet toegestaan is. Dat IE hem rendert zoals je verwacht lijkt me toeval.

Onbekende gebruiker

15-12-2005 20:35

POTVER! HET WERKT!!!

Dank u!!!

Jan Koehoorn

15-12-2005 20:36

Graag gedaan!

Steven Pollux

15-12-2005 22:30

Misschien is het ook wel handig om een doctype mee te geven aan je pagina? Dat voorkomt ook een hele hoop fouten!

Reageren

Inloggen om te reageren