login  Naam:   Wachtwoord: 
Registreer je!
 Forum

[CSS] Absolute/relatieve hoogte en breedte (Opgelost)

Offline henver - 27/02/2010 20:22 (laatste wijziging 27/02/2010 20:40)
Avatar van henverHTML gevorderde Ik zit al enkele uren mijn hoofd te breken over volgend probleem: ik wil onderstaande opbouw verkrijgen zonder dat er scrollbalken te zien zijn:

Klik voor indeling

Ik heb gegoogeld en heb 1 resultaat gevonden dat me aanstond, het probleem was dat de footer niet onderaan stond en dat de breedte van de inhoud niet maximaal was.

Alvast bedankt!

Hendrik

4 antwoorden

Gesponsorde links
Offline pijke - 27/02/2010 20:35 (laatste wijziging 27/02/2010 20:37)
Avatar van pijke Gouden medaille

Lid		 als je geen scrollbalken wilt, zet je toch gewoon in de opmaak van de header, footer, menu en inhoud overflow: hidden;
en ik zou het menu een float: left; geven.
en zo'n afbeelding ter verduideliking is wel handig 

edit
sorry, ik was vergeten erbij te zetten dat het handig zou zijn als de afbeelding werkend zou zijn 
Offline Martijn - 27/02/2010 20:37
Avatar van Martijn Crew PHP zonder die footer kan ik m je uitleggen 

Je maakt 1 container div. Die maak je met css 100% width en heigth. Dan maak je een div header, gewoon je groottes instellen.
Dan maak je je linker menu met position absolute, en dan left:0px;. Daarna je rechtermenu met right: 0px; en daarna je center met left: 250px;

en scrollbalken kun je bedienen met overflow: auto/visible/hidden;
Bedankt door: henver
Offline pijke - 27/02/2010 20:40 (laatste wijziging 27/02/2010 20:52)
Avatar van pijke Gouden medaille

Lid		 waarom doe je niet gewoon:
css code - Bekijk de code zonder highlighting - Klap code in 
  1. leftmenu {
  2. float: left;
  3. overflow: hidden;
  4. }
  5.  
  6. rightmenu {
  7. float: right;
  8. overflow: hidden;
  9. }

en dan nog de rest erbij
of zeg ik nu iets heel doms 

edit
volgens mij heb ik hem:
css code - Bekijk de code zonder highlighting - Klap code in 
  1. header {
  2. width: 100%;
  3. height: 75px;
  4. }
  5. menu {
  6. width: 250px;
  7. float: left;
  8. }
  9. main {
  10. width: 100%;
  11. padding-left: 250px;
  12. }
  13. footer {
  14. width: 100%;
  15. height: 25px;
  16. clear: both;
  17. }

hopelijk werkt het.
Bedankt door: henver
Offline henver - 04/03/2010 21:40
Avatar van henver HTML gevorderde got it, thanks all !!!
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.185s