login  Naam:   Wachtwoord: 
Registreer je!
 Forum

div werkt niet goed

Offline skillat2 - 06/10/2006 23:28 (laatste wijziging 07/10/2006 19:09)
Avatar van skillat2HTML beginner Hoi,

Ik heb een site gemaakt in photoshop, deze gesliced en met div's ingevoerd.
Nu heb ik al van alles geprobeerd maar ik krijg m'n layout niet netjes, heeft iemand misschien een idee wat er fout is ?

Het idee van m'n layout is dat de text doorloopt (daarom gebruik ik height: 100%).
Hieronder een gedeelte van de stylesheet:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. #menu
  2. {
  3.     position: absolute;
  4.     height: 100%;
  5.     width: 214px;
  6.     background-image: url('images/hannema_05.jpg');
  7. }
  8. #content
  9. {
  10.     height: 100%;
  11.     width: 545px;
  12.     background-image: url('images/hannema_06.jpg');
  13. }



Layout:
http://www.hannema.info
Volledige Stylesheet:
http://hannema.sneldesign.com/style.css

8 antwoorden

Gesponsorde links
Offline Nation - 07/10/2006 00:20
Avatar van Nation PHP interesse geef je html ook eens,

het lijkt erop dat er iets fout loopt in je table;
wat niet met je css te maken heeft.
Offline Martijn1989 - 07/10/2006 01:28
Avatar van Martijn1989 PHP ver gevorderde omfg :/ ... je kan tog de bron bekijken van zen website?

php code - Bekijk de code zonder highlighting - Klap code in 
  1. <html>
  2.  
  3. <head>
  4.  
  5. <title>Administratie Kantoor Hannema</title>
  6.  
  7. <link rel="stylesheet" type="text/css" href="style.css" />
  8.  
  9. </head>
  10.  
  11. <body>
  12.  
  13. <div id="header">
  14.  
  15. </div>
  16.  
  17. <div id="menu">
  18. Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
  19. </div>
  20.  
  21. <div id="content">
  22. Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
  23. </div>
  24.  
  25. <div id="bottom">
  26.     <img src="images/hannema_07.jpg">
  27. </div>
  28.  
  29. </body>
  30.  
  31. </html>
Offline Soebam - 07/10/2006 11:19
Avatar van Soebam HTML ver gevorderde Je hebt position: absolute bij je menu. Daarom begint de content niet naast het menu, maar ook gewoon links op de pagina.
Offline skillat2 - 07/10/2006 17:29
Avatar van skillat2 HTML beginner Soebam, als ik dat niet doe dan ziet het er zo uit.. dan staat het helemaal niet meer naast elkaar..

http://hannema.sneldesign.com/test.html
http://hannema.sneldesign.com/test.css
Offline Soebam - 07/10/2006 17:37
Avatar van Soebam HTML ver gevorderde Neenee ik bedoel, omdat je position: absolute hebt bij je menu, telt die div niet meer mee met het positioneren van andere div's. Je moet daarom bij bijvoorbeeld bij content een left-margin ofzo zetten, omdat die anders gewoon links uitgelijnd wordt.
Offline skillat2 - 07/10/2006 17:40 (laatste wijziging 07/10/2006 20:04)
Avatar van skillat2 HTML beginner ah oke, nu heb ik dat gedaan alleen dan is het daaronder weer helemaal in de war 

http://hannema.sneldesign.com/
http://hannema.sneldesign.com/style.css

edit: in IE is de layout helemaal waardeloos, firefox valt nog wel mee.. alleen onderin.
Kan iemand mij de gouden tip geven  

php code - Bekijk de code zonder highlighting - Klap code in 
  1. /*
  2. Menu
  3. */
  4.  
  5. #menu
  6. {
  7.     position: absolute;
  8.     height: 100%;
  9.     width: 214px;
  10.     background-image: url('images/hannema_05.jpg');
  11. }
  12.  
  13. /*
  14. Content
  15. */
  16.  
  17. #content
  18. {
  19.     margin-left: 214px;
  20.     height: 100%;
  21.     width: 545px;
  22.     background-image: url('images/hannema_06.jpg');
  23. }
Offline knoopa - 07/10/2006 20:42
Avatar van knoopa Onbekend link is dood
Offline skillat2 - 07/10/2006 22:49
Avatar van skillat2 HTML beginner mja, kwam er niet meer uit.. ben nu van scratch begonnen.. gaat goed alleen een header en geen overbodige border images.

#slotje
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.305s