login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Een divje wilt niet meer uitrekken. (Opgelost)

Offline Thomas_c - 05/04/2009 00:19
Avatar van Thomas_cNieuw lid Goedenavond,

Ik heb veel kennis van <div> nodig om een nieuwe site te maken,
echt krijg ik een <div> niet meer gerekt met de inhoud er van.
Op dit forum heb ik al wat gezocht naar wat ik nodig had, maar ik kan steeds niet vinden wat voor mij van belang is.

op deze site http://www.rising-hope.nl/wimako1.1/index.php
kan je zien wat mijn probleem is.

Hopelijk kunnen jullie mij helpen.
Alvast bedankt.

Mijn CSS is:
  1. body {
  2. margin-left:0px;
  3. margin-top:0px;
  4. background-image:url(../img/layout/default/basebg.jpg);
  5. font-family: Verdana, Tahoma;
  6. font-size: 10px;
  7. color: #000000;
  8. }
  9. h1 {
  10. color:black;
  11. font-family: Verdana;
  12. font-size:11px;
  13. font-weight:bold;
  14.  
  15. }
  16. #mainContainer {
  17. width:1024px;
  18. margin-left:auto;
  19. margin-right:auto;
  20. position:relative;
  21. }
  22. #mainContainer #header {
  23. height:100px;
  24. border-right:1px #666666 solid;
  25. border-left:1px #666666 solid;
  26. background-image:url(../img/layout/default/header.jpg);
  27. }
  28. #mainContainer #headerNav {
  29. height:25px;
  30. border-right:1px #666666 solid;
  31. border-left:1px #666666 solid;
  32. border-bottom:1px #666666 solid;
  33. background-image:url(../img/layout/default/headernav.jpg);
  34. }
  35. #mainContainer #mainFrame {
  36. border-left:1px #666666 solid;
  37. border-right:1px #666666 solid;
  38. border-bottom:1px #666666 solid;
  39. background-color:white;
  40. position:relative;
  41. }
  42. .blockLayout {
  43. margin-top:10px;
  44. margin-bottom:10px;
  45. margin-left:auto;
  46. margin-right:auto;
  47. border:1px #666666 solid;
  48. background-color:white;
  49. width:170px;
  50. height:50px;
  51. }
  52. .blockTitle {
  53. color:black;
  54. font-family: Verdana;
  55. font-size:11px;
  56. font-weight:bold;
  57. position:absolute;
  58. margin-top:2px;
  59. margin-left:20px;
  60. }
  61. .blockTitleBackGround {
  62. background-image:url(../img/layout/default/bar.jpg);
  63. height:20px;
  64. border-bottom:1px #666666 solid;
  65. text-align:left;
  66. vertical-align:middle;
  67. position:relative;
  68. }
  69. .blockContent {
  70. text-align:left;
  71. padding-left:4px;
  72. font-family: Verdana, Tahoma;
  73. font-size:10px;
  74. font-weight:normal;
  75. color:#000000;
  76. }
  77.  
  78.  
  79. #mainFrame #blockHolderLeft {
  80. left: 0px;
  81. top: 0px;
  82. width: 180px;
  83. text-align: center;
  84. float: left;
  85. }
  86. #mainFrame #mainContent {
  87. top: 0px;
  88. width:635px;
  89. margin-left:auto;
  90. margin-right:auto;
  91. padding-top:10px;
  92. padding-bottom:10px;
  93. }
  94. #mainFrame #blockHolderRight {
  95. float: right;
  96. right: 0px;
  97. top: 0px;
  98. width: 180px;
  99. text-align: center;
  100.  
  101. }
  102. .mainContentFrame {
  103. background-image:url(../img/layout/default/centerbar.jpg);
  104. background-repeat:repeat-x;
  105. height:20px;
  106. border:1px #666666 solid;
  107. }
  108. .mainContentFrameTitle {
  109. position:absolute;
  110. margin-top:3px;
  111. margin-left:3px;
  112. }
  113. .mainContentContent {
  114. border-left:1px #666666 solid;
  115. border-right:1px #666666 solid;
  116. border-bottom:1px #666666 solid;
  117. background-color:white;
  118. padding-top:5px;
  119. padding-left:5px;
  120. }
  121. #footer {
  122. background-color:#BFBFBF;
  123. height:20px;
  124. border-left:1px #666666 solid;
  125. border-right:1px #666666 solid;
  126. border-bottom:1px #666666 solid;
  127. text-align:center;
  128. }
  129. #footer #footerText {
  130. color:#666666;
  131. margin-top:3px;
  132. font-size:9px;
  133. }
  134. .clear {
  135. clear:both;
  136. }


en html:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <title>Wimako.nl</title>
  6. <link href="style/style.css" rel="stylesheet" type="text/css" />
  7. </head>
  8.  
  9. <body>
  10. <div id="mainContainer">
  11. <div id="header"></div>
  12. <div id="headerNav"></div>
  13. <!-- ======================== START MAINFRAME ========================== -->
  14. <div id="mainFrame">
  15. <!-- ======================== START BLOCKHOLDERLEFT ========================== -->
  16. <div id="blockHolderLeft">
  17. <!-- [BLOCK] -->
  18. <div class="blockLayout">
  19. <div class="blockTitleBackGround">
  20. <div class="blockTitle">Titel</div>
  21. </div>
  22. <div class="blockContent">
  23. inhoud<br />
  24. inhoud<br />
  25. inhoud<br />
  26. inhoud<br />
  27. </div>
  28. </div>
  29. <!-- [/BLOCK] -->
  30. <!-- [BLOCK] -->
  31. <div class="blockLayout">
  32. <div class="blockTitleBackGround">
  33. <div class="blockTitle">Titel</div>
  34. </div>
  35. <div class="blockContent">
  36. inhoud<br />
  37. inhoud<br />
  38. inhoud<br />
  39. inhoud<br />
  40. </div>
  41. </div>
  42. <!-- [/BLOCK] -->
  43. </div>
  44. <!-- ======================== END BLOCKHOLDERLEFT ========================== -->
  45. <!-- ======================== START BLOCKHOLDERRIGHT ========================== -->
  46. <div id="blockHolderRight">
  47. <!-- [BLOCK] -->
  48. <div class="blockLayout">
  49. <div class="blockTitleBackGround">
  50. <div class="blockTitle">Titel</div>
  51. </div>
  52. <div class="blockContent">
  53. inhoud
  54. </div>
  55. </div>
  56. <!-- [/BLOCK] -->
  57. </div>
  58. <!-- ======================== END BLOCKHOLDERRIGHT ========================== -->
  59. <!-- ============================= MAIN CONTENT ======================================= -->
  60. <div id="mainContent">
  61. <div class="mainContentFrame">
  62. <div class="mainContentFrameTitle"><h1>Welkom bij wimako.nl</h1></div>
  63. </div>
  64. <div class="mainContentContent">
  65. Hier wat teksten
  66. </div>
  67. </div>
  68. <div class="clear"></div>
  69. </div>
  70. <!-- =================================== END MAINFRAME ================== -->
  71. <div id="footer">
  72. <div id="footerText">&copy; Copyright Wimako.nl 2008 | Design and programmed by Thomas Croonen </div>
  73. </div>
  74. </div>
  75. </body>
  76. </html>


5 antwoorden

Gesponsorde links
Offline Filip - 05/04/2009 00:33
Avatar van Filip IRC guru plaatscode en pastebin zijn wel leuk he.... Code langer dan 75 lijnen liefst op een van deze sites zetten.. Edit je post, en plaats alleen de links naar pastebin of plaatscode.

(Post done voor Sliphead (moderator) omdat hij te lui is om te editen )
Offline Koen - 05/04/2009 00:36
Avatar van Koen PHP expert
nephilim schreef:
plaatscode en pastebin zijn wel leuk he.... Code langer dan 75 lijnen liefst op een van deze sites zetten.. Edit je post, en plaats alleen de links naar pastebin of plaatscode.

(Post done voor Sliphead (moderator) omdat hij te lui is om te editen )


<3
Offline Filip - 05/04/2009 00:36
Avatar van Filip IRC guru
sliphead schreef:
[..quote..]

<3


't is niks zene 
Offline shibble - 05/04/2009 00:40
Avatar van shibble MySQL interesse HAHAHAHA lazy ass sliphead !

probeer is "<div class="clear"> </div>" onder de div's te zetten waar die lengte automatisch mee moet gaan... en de height van ".blockLayout" halen.
Offline Thomas_c - 05/04/2009 00:43
Avatar van Thomas_c Nieuw lid ZOMG! Vergeten, en 10x over heen gelezen dat ik nog een height had opgegeven.

Mijn oogjes zijn half dicht van het bier, thanks voor jullie open oogjes <3
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.376s