login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Div 100% hoogte en gelijke kolommen

Offline remy - 24/11/2006 12:19
Avatar van remyPHP ver gevorderde Hey

Ik ben nu een paar dagen aan het klooien met css om een layout te maken welke aan de volgende eisen moet voldoen:

- 2 gelijke kolommen (de een gaat mee in hoogte afhankelijk van de ander) (naar aanleiding van de Holy Grail)
- minimaal 100% hoogte
- een header.

Nu lukt het prima om 2 divs met css altijd gelijk te laten blijven, nu lukt het ook om deze op minimaal 100% te maken, maar zodra ik de header erbij wil doen, is deze extra hoogte teveel, waardoor ik een schuifbalk krijg.

De 2 onderliggende divs naast elkaar zijn dus 100% hoog, maar iets verschoven naar beneden. (afkankelijk van de hoogte van de header)

Is dit op te lossen op 1 of andere manier? Of heeft iemand een voorbeeld website, want ik kom er niet meer uit. 

7 antwoorden

Gesponsorde links
Offline Thomas - 24/11/2006 12:25 (laatste wijziging 24/11/2006 12:26)
Avatar van Thomas Moderator Wat is 100%? Dat verschilt per gebruiker / browser.

Werk met absolute waarden (px) of verzin een opzet met background-images. Dat lijken mij de enige 2 oplossingen.

Of je maakt een ranzige constructie met JavaScript waarmee je de resolutie opslaat in een cookie, die je vervolgens gebruikt om je CSS te genereren... *braak*
Offline remy - 24/11/2006 13:01
Avatar van remy PHP ver gevorderde Nee ik heb het nu zover dat ik dat stukje over de holy grail werkend heb met 2 kolommen. Dit is echt puur css en komt geen javascript an te pas. Nu is het enige dus dat de header die ik erbij gemaakt heb ook binnen de 100% hoogte van de pagina valt.

Die 100% bedoel ik dus mee dat ik geen scrollbalken wil zien en toch de hele pagina gevuld is.
De text die erin komt is op elke pagina anders, dus een fixed height kan ik eigenlijk niet gebruiken dan.
Dat van die backgroundimages is trouwens ook niet echt netjes  
Offline Thomas - 24/11/2006 13:54
Avatar van Thomas Moderator
Citaat:
Dat van die backgroundimages is trouwens ook niet echt netjes
Waarom niet? Is een prima CSS-valid oplossing? Kost weinig code / bandbreedte / ...?
Offline remy - 24/11/2006 16:53
Avatar van remy PHP ver gevorderde oh wel? ik las bij sommige sites tussen de regels door dat ze het niet de beste oplossing vonden.
Ik zelf vind de opslosing met negatieve margins eigenlijk wel beter, waarom weet ik eigenlijk ook niet. Zo gerbuik je een achtergrond platje ergens voor waar hij niet voor bedoeld is.
maar ik heb nu het een en ander gevonden en ga het proberen om te zetten naar negative margins 
Offline Thomas - 24/11/2006 17:01
Avatar van Thomas Moderator Ik heb een keer mijn pagina horizontaal gecentreerd met negatieve margins. Je doet dan zoiets als margin-left: 50% en left: <de helft van de breedte van de content, negatief>.

Dit is ook CSS-valid, maar IE vindt dat gebieden die niet zichtbaar zijn (dat negatieve left-gedeelte dus) ook niet navigeerbaar zijn (ook al transleer ik het 50% naar rechts).

Resultaat: een halflamme niet-navigeerbare site in IE.
Offline remy - 24/11/2006 22:00
Avatar van remy PHP ver gevorderde Hmm ja IE doet wel vaker vreemd. Ook met die plaatjes kun je je text weer niet goed krijgen. In firefox staat het netjes waar ik zou denken dat het hoort en in IE zweeft de text ergen door het midden van de pagina.

maja, ik heb al iets gevonden, dus dees mag dicht.
Offline Thomas - 25/11/2006 00:17
Avatar van Thomas Moderator o p l o s s i n g ?
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.182s