[CSS/HTML] krijg geen horizontale scrollbalk.

[Predje]

Hey Hey,

Ben bezig een valide CSS2.0 / HTML4.01 (Strict) website te maken.
Nu is het alleen gek dat ik geen horizontale scrollbalk te zien krijg..
Overflow-x en -y zijn niet valide, overflow: visible; geen alleen een verticale scrollbalk in Mozilla.
Overflow weglaten geeft in IE standaard al een verticale scrollbalk en in firefox pas als het nodig is (auto?).

Overflow: auto; werkt in beide (FF2.0 / IE7.0) exact hetzelfde, alleen in beide krijg ik geen horizontale scrollbalk. HTML, BODY en HolderDiv allen op 100% width en 900px min-width.
Hoe smal ik de browser ook maar ik zie alleen maar content uit beeld verdwijnen zonder horizontaal te kunnen scrollen.

Relevante CSS:

code:

*
{
    margin: 0px;
    padding: 0px;
}

html, body 
{
    height: 100%;
    width: 100%;
    min-height: 600px;
    min-width: 900px;
    font-family: Verdana, Arial;
    font-size: 10pt;
    overflow: auto;
}

#HolderDiv 
{
    background-color: #FFF;
    width: 100%;
    height: 100%;
    min-height: 600px;
    min-width: 900px;
    position: relative;
}

Voorbeeld (w.i.p.) http://www.moosdijk.com/wesley/nieuw

Hoop dat iemand me kan helpen, zoeken geeft alleen topics over mensen die van de horizontale balk af willen.

Greetz.

[Verwijderd]

Als je width een vaste breedte geeft krijg je iig wel een balk, alleen dan rekt het niet uit. Het is keuze.
Als ik naar je site kijk zou ik hem een breedte van 1000px geven. De site gaat er niet op achteruit (je site ziet er goed uit)

[JHS]

Verwijder de width op de HolderDiv, body en html, of maak er min-width: 100%; i.c.m. width: 100%; in een conditional statement voor IE van ?

[ Voor 5% gewijzigd door JHS op 04-01-2007 11:12 ]

[Predje]

Verwijderd schreef op donderdag 04 januari 2007 @ 10:57:
Als je width een vaste breedte geeft krijg je iig wel een balk, alleen dan rekt het niet uit. Het is keuze.
Als ik naar je site kijk zou ik hem een breedte van 1000px geven. De site gaat er niet op achteruit (je site ziet er goed uit)

Al geprobeerd, zelfs met 1800px; pagina rekt wel uit, maar nog altijd zonder scroll.

[Predje]

JHS schreef op donderdag 04 januari 2007 @ 11:08:
Verwijder de width op de HolderDiv, of maak er min-width: 100%; i.c.m. width: 100%; in een conditional statement voor IE van ?

Ik snap eigelijk niet helemaal wat je bedoeld, is er iets fout aan de CSS?

[Verwijderd]

Predje schreef op donderdag 04 januari 2007 @ 11:12:
[...]

Ik snap eigelijk niet helemaal wat je bedoeld, is er iets fout aan de CSS?

Als je de width van de holderdiv 100% maakt wordt de pagina altijd evengroot als het scherm, dus krijg je nooit een scrolbalk. Geef de holderdiv width (dus niet de min-width) eens 1000px.

//edit
als ik dit aanpas werkt het goed

code:

*
{
    margin: 0px;
    padding: 0px;
}

html, body 
{
    height: 100%;
    width: 100%;
    font-family: Verdana, Arial;
    font-size: 10pt;
}

#HolderDiv 
{
    background-color: #FFF;
    width: 1000px;
    position: relative;
}

[ Voor 29% gewijzigd door Verwijderd op 04-01-2007 11:28 ]

[Evilbee]

Met de volgende code kreeg ik het wel voorelkaar:

Cascading Stylesheet:

div {
    overflow: auto;
    white-space: nowrap;
}

[JHS]

Predje schreef op donderdag 04 januari 2007 @ 11:12:
[...] Ik snap eigelijk niet helemaal wat je bedoeld, is er iets fout aan de CSS?

Zoals /me aangeeft, geef je een vaste breedte op van 100%, de breedte van de viewport dus. Je site zal dus niet smaller of breeder worden, terwijl je dat wel wilt. Je zou om dat op te lossen width dus helemaal weg kunnen laten . Waarom heb je dat er eigenlijk in staan?

[ Voor 4% gewijzigd door JHS op 04-01-2007 11:41 ]

[Predje]

Verwijderd schreef op donderdag 04 januari 2007 @ 11:25:
[...]
Als je de width van de holderdiv 100% maakt wordt de pagina altijd evengroot als het scherm, dus krijg je nooit een scrolbalk. Geef de holderdiv width (dus niet de min-width) eens 1000px.

Klopt niet wat je zegt; 100% is idd altijd 100%, maar min-width: 900px; zorgt er alleen voor dat de pagina niet verder in kan schuiven dan 900px;.
Ik wil dat de pagina altijd 100% is en niet 1000px (hij moet beeldvullend zijn op 1024, 1280, 1600, 1900, etc.) Maar niet smaller dan 900px, anders gaan element elkaar overlappen en is de layout naar de knoppen.

Nu heb ik het zo:

code:

html, body 
{
    height: 100%;
    width: 100%;
    font-family: Verdana, Arial;
    font-size: 10pt;
    overflow: auto;
}

#HolderDiv 
{
    background-color: #FFF;
    height: 100%;
    width: 100%;
    min-width: 900px;
    position: relative;
}

En dit werkt prima in beide browsers, vraag me niet waarom..
Alleen krijg ik wel weer in FF een verticale scrollbar die precies even groot is als de hoogte van de horizontale scrollbar.

[Predje]

JHS schreef op donderdag 04 januari 2007 @ 11:41:
[...]
Zoals /me aangeeft, geef je een vaste breedte op van 100%, de breedte van de viewport dus. Je site zal dus niet smaller of breeder worden, terwijl je dat wel wilt. Je zou om dat op te lossen width dus helemaal weg kunnen laten . Waarom heb je dat er eigenlijk in staan?

Gek dat het dan wel werkt met de height vind je niet?
Hij moet gewoon altijd 100% zijn van het scherm, alleen niet minder dan 900px dan moet ik gaan scrollen. De width is natuurlijk opgegeven om de elementen ook de juiste breedte te kunnen geven.
Die width 100% is nodig om de layout te kunnen maken.