login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Ruimte tussen divs

Offline tomie94 - 15/09/2008 16:46
Avatar van tomie94PHP interesse Hallo,

Ik heb de volgende codes:
CSS:
  1. body { margin: 0; padding: 0; background-image: url('http://localhost/blueprint2/images/background.png'); }
  2. .container { width: 1024px; height: auto; margin: 25px auto; }
  3. .header { width: 1024px; height: 100px; background-image: url('http://localhost/blueprint2/images/header.gif'); }
  4. .menu { width: 1024px; height: 25px; background-image: url('http://localhost/blueprint2/images/menu.gif'); }
  5. .container .middle { width: 1024px; height: auto; background-image: url('http://localhost/blueprint2/images/container.gif'); }
  6. .newest_bar { width: 1000px; height: 100px; margin-left: 12px; margin-top: 20px; background-image: url('http://localhost/blueprint2/images/bar.gif'); }


HTML:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  4. <head>
  5. <title>Blue Print 2</title>
  6. <link href="http://localhost/blueprint2/applications/templates/freshandpixel/style.css" rel="stylesheet" type="text/css" />
  7. </head>
  8. <body>
  9.  
  10. <div class="container">
  11. <div class="header">
  12. </div>
  13. <div class="menu">
  14. </div>
  15. <div class="middle"><div class="newest_bar"></div></div>
  16. </div>
  17. </body>
  18. </html>


Hier komt het volgende uit: http://img184.i...eenuo3.jpg

Zoals je ziet, zit er ruimte tussen het menu(die blauwe balk) en de div daaronder. Hoe kan ik dit oplossen?

6 antwoorden

Gesponsorde links
Offline marten - 15/09/2008 16:47
Avatar van marten Beheerder padding en margin op 0 zetten van die divjes.
Offline Kr4nKz1n - 15/09/2008 16:48
Avatar van Kr4nKz1n Onbekend handig om ook je CSS in orde te houden met tabs etc.

Vooral voor momenten als nu, nu zien we lange zinnen etc., het kan een stuk makkelijker.
Offline tomie94 - 15/09/2008 16:49 (laatste wijziging 15/09/2008 16:50)
Avatar van tomie94 PHP interesse Als ik de padding en margin op 0 zet, blijft het hetzelfde.

  1. body
  2. {
  3. margin: 0;
  4. padding: 0;
  5. background-image: url('http://localhost/blueprint2/images/background.png');
  6. }
  7. .container
  8. {
  9. width: 1024px;
  10. height: auto;
  11. margin: 25px auto;
  12. }
  13. .header
  14. {
  15. width: 1024px;
  16. height: 100px;
  17. padding: 0;
  18. margin: 0;
  19. background-image: url('http://localhost/blueprint2/images/header.gif');
  20. }
  21. .menu
  22. {
  23. width: 1024px;
  24. height: 25px;
  25. padding: 0;
  26. margin: 0;
  27. background-image: url('http://localhost/blueprint2/images/menu.gif');
  28. }
  29. .container .middle
  30. {
  31. width: 1024px;
  32. padding: 0;
  33. margin: 0;
  34. height: auto;
  35. background-image: url('http://localhost/blueprint2/images/container.gif');
  36. }
  37. .newest_bar
  38. {
  39. width: 1000px;
  40. height: 100px;
  41. margin-left: 12px;
  42. margin-top: 20px;
  43. background-image: url('http://localhost/blueprint2/images/bar.gif');
  44. }
Offline Kr4nKz1n - 15/09/2008 16:55
Avatar van Kr4nKz1n Onbekend <div></div>

Gelijk achter elkaar zetten zonder enters/tabs/spaties etc.
Offline tomie94 - 15/09/2008 17:01 (laatste wijziging 15/09/2008 18:57)
Avatar van tomie94 PHP interesse waar moet ik dat zetten? want bij mij werkt het op elke plek niet. ik krijg het ook op geen enkele manier opgelost...

[edit]

door: position: relative; top:0px; bottom: 0px; toe te voegen aan .container .middle doet hij het in ie8 goed, in ff, doet hij hetzelfde als op vorige screenshot.

Screenshots komen zo
Offline Kr4nKz1n - 15/09/2008 19:13
Avatar van Kr4nKz1n Onbekend Heb je alle enters tussen de div tags gehaald?
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.194s