[css] probleem met height 100% en veel cq weining content

[BetuweKees]

hi,

probeer een simpele layout in elkaar te zetten waarbij een content layer 100% viewport heeft, in colom van 800px breed met een paar border ed er om heen. vrij standaard. zie http://www.weijmans.net/test/100-procent/ voor een testcase.

probleem is echter dat er bij een te veel aan content (zie testcase) een probleem kreeg met overflow; de content flowd uit de container, zonder dat de achtergrond meegaat, en zorgt er dus voor dat de text slecht leesbaar wordt.

door toevoegen van

Cascading Stylesheet:

body>#content { min-height: 100%; height: auto; }

is dat op te lossen, echter, doe ik dit, dan ontstaat het probleem dat er bij een kleine hoeveelheid content (lees: minder dan nodig is om de container te laten overflowen) toch altijd een scrollbar zichtbaar is. dit is ook weer niet de bedoeling.

kortom, zonder bovenstaande stukje code is de scrollbar alleen aanwezig wanneer dat nodig is, maar gaat het mis omdat er een overflow optreedt; maar met het stukje code, is er, ondanks het feit dat het overflow probleem opgelost is, altijd een scrollbalk aanwezig.

wie weet hoe ik dat op kan lossen?

[JHS]

Je site doet het niet . Dus we kunnen ook de html en je css niet bekijken . Hij doettet idd weer .

[ Voor 15% gewijzigd door JHS op 07-11-2004 15:10 ]

[Clay]

mozilla (en opera ook trouwens) tellen padding en border gewoon op bij de min-height, ongeacht de box-sizing. Geen idee of dat goed is trouwens, kan uit de specs niet echt iets zinnigs hierover afleiden.

[BetuweKees]

JHS schreef op 07 november 2004 @ 09:31:
Je site doet het niet . Dus we kunnen ook de html en je css niet bekijken .

hmm.. hier doet ie t prima..

Clay schreef op 07 november 2004 @ 11:28:
mozilla (en opera ook trouwens) tellen padding en border gewoon op bij de min-height, ongeacht de box-sizing. Geen idee of dat goed is trouwens, kan uit de specs niet echt iets zinnigs hierover afleiden.

hmm.. had gister juist eens met de verschillende boxmodels lopen spelen voor dit ontwerpje en met een border-box leek alles goed te gaan. totdat ik aan kwam met die min-height dus..

ligt de oplossing dus in het kiezen van een ander box-model of is er aan ander manier waarop dit werkzaam zou moeten worden?

[JHS]

Je code is zoiezo nogal een rotzooi .
Blaat

Je sluit je tags niet af .

Ik ben teveel bezig met waar ik mee bezig was

[ Voor 122% gewijzigd door JHS op 07-11-2004 16:59 ]

[faabman]

JHS schreef op 07 november 2004 @ 15:17:
onzin...

hoezo is zijn code een rotzooi, hij gebruikt toch geen xHTML??? valideer hem anders maar eens met de w3c validator...

@TS: je zou je probleem op kunnen lossen door een achtergrondplaatje toe te passen op de body met daarin het effect wat je nu op je content - container toepast...

[ Voor 103% gewijzigd door faabman op 07-11-2004 15:55 ]

[BetuweKees]

JHS schreef op 07 november 2004 @ 15:17:

HTML:

    <p>blaat

Je sluit je tags niet af .

AFAIK hoeft een <p> niet afgesloten (afsluitende tag is optional) en daarnaast is pagina Valid HTML 4.01 Strict, dus ik zie het probleem niet zo (en daarnaast is het compleet offtopic, omdat je hiermee het probleem wat ik aangeef niet oplost, maar dat geheel terzijde)

faabman schreef op 07 november 2004 @ 15:50:
@TS: je zou je probleem op kunnen lossen door een achtergrondplaatje toe te passen op de body met daarin het effect wat je nu op je content - container toepast...

dank voor de tip