login  Naam:   Wachtwoord: 
Registreer je!
 Forum

HTML AND CSS Loopt vast

Offline JBrouwer - 04/11/2005 19:14 (laatste wijziging 05/11/2005 16:42)
Avatar van JBrouwerNieuw lid /!\ De pagina word steeds geupdate, dus mijn vraag kan afwijken van de site. Let daar wel op! /!\

Hey, ik heb de volgende code:

index.html
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html>
  3. <head>
  4. <title>Miss United - Counterstrike ladies</title>
  5. <link rel="stylesheet" type="text/css" href="style.css" media="all" />
  6. </head>
  7. <body>
  8. <div id="top_menu">
  9. <div id="menu_kopjes">
  10. <a href="#"><img src="images/layout_02.gif" alt="home" border="0" /></a>
  11. <a href="#"><img src="images/layout_03.gif" alt="contact" border="0" /></a> </div>
  12. </div>
  13. <div id="centeren">
  14. <div id="content">
  15. <div id="header"></div>
  16. <div id="menu">
  17. <div><a href="#"><img src="images/image_11.gif" alt="news" border="0" /></a></div>
  18. <div><a href="#"><img src="images/image_15.gif" alt="roster" border="0" /></a></div>
  19. <div><a href="#"><img src="images/image_16.gif" alt="matches" border="0" /></a></div>
  20. <div><a href="#"><img src="images/image_17.gif" alt="downloads" border="0" /></a></div>
  21. <div><a href="#"><img src="images/image_18.gif" alt="about" border="0" /></a></div>
  22. </div>
  23. <div id="banner"><img src="images/image_13.gif" alt="Sponsord by:" /></div>
  24. </div>
  25. </div>
  26. </body>
  27. </html>


style.css
  1. /*---------------------------------------------------------------------------------------------------------------------*/
  2. /*______________________________________________________MAIN WORK______________________________________________________*/
  3. /*---------------------------------------------------------------------------------------------------------------------*/
  4.  
  5. body {
  6. background-color: #9B0000;
  7. font-family: tahoma;
  8. font-size: 12px;
  9. color: #191919;
  10. margin: 0;
  11. }
  12.  
  13. #centeren {
  14. margin: 0 auto;
  15. width: 847px;
  16. background-color: #E2E2E2;
  17. padding: 7px;
  18. }
  19.  
  20. #content {
  21. background-color: #FFFFFF;
  22. border: #C3C3C3 1px solid;
  23. padding: 10px;
  24. }
  25.  
  26. /*---------------------------------------------------------------------------------------------------------------------*/
  27. /*______________________________________________________TOP MENU_______________________________________________________*/
  28. /*---------------------------------------------------------------------------------------------------------------------*/
  29.  
  30. #top_menu {
  31. width: 100%;
  32. height: 33px;
  33. background-image: url(images/layout_04.gif);
  34. azimuth: right;
  35. }
  36.  
  37. #menu_kopjes {
  38. padding-left: 70%;
  39. }
  40.  
  41. /*---------------------------------------------------------------------------------------------------------------------*/
  42. /*_____________________________________________________HEADER WORK_____________________________________________________*/
  43. /*---------------------------------------------------------------------------------------------------------------------*/
  44.  
  45. #header {
  46. background-color: #2E496D;
  47. background-image: url(images/layout_07.gif);
  48. background-repeat: repeat-y;
  49. height: 105px;
  50. width: 100%;
  51. border-bottom: #FFFFFF 4px solid;
  52. }
  53.  
  54. /*---------------------------------------------------------------------------------------------------------------------*/
  55. /*_____________________________________________________MENU SHIT_______________________________________________________*/
  56. /*---------------------------------------------------------------------------------------------------------------------*/
  57.  
  58. #menu {
  59. width: 229px;
  60. border-right: 4px #FFFFFF solid;
  61. float: left;
  62. }
  63.  
  64. #banner {
  65. width: 578px;
  66. float: right;
  67. }


Online site
http://www.wyger.nl/usr/konijn/works/Miss_United/

Nu valt je al meteen een probleem op, het sponsor gedeelte hoord duidelijk naast het menu te zitten. Alleen ik heb geen idee hoe ik dit op los via CSS.

Graag zou ik duidelijke reacties willen zien. Als je mijn code verbeterd zou het fijn zijn als je ook uitlegt geeft van wat je nou gedaan hebt.

BVD

/!\ De pagina word steeds geupdate, dus mijn vraag kan afwijken van de site. Let daar wel op! /!\

6 antwoorden

Gesponsorde links
Offline stenno - 04/11/2005 19:16
Avatar van stenno PHP interesse
gewoon float: right mee geven aan je sponsor div
Offline JBrouwer - 04/11/2005 19:18
Avatar van JBrouwer Nieuw lid Nee dat klopt niet stenno, als ik dat doe dan komt de div nog steeds onder het menu. Wel rechts, maar niet er naast. En dat is het probleem.

ps; zie site voor het probleem.
Offline stenno - 04/11/2005 19:24
Avatar van stenno PHP interesse
geef je div menu dan float: left; mee dan komen ze wel naast elkaar. 
Offline JBrouwer - 04/11/2005 19:28
Avatar van JBrouwer Nieuw lid Nee joh, dat help sowieso niet! Want dan zit de div: content en centreren er niet meer eromheen. Zie ook de site voor een voorbeeld.
Er moet toch een oplossing zijn?
Offline stenno - 04/11/2005 19:40
Avatar van stenno PHP interesse
Man dit is harstikke goed  Je moet alleen je div content er omheen gooien  Post je nieuwe script anders ff
Offline JBrouwer - 04/11/2005 19:42 (laatste wijziging 05/11/2005 11:50)
Avatar van JBrouwer Nieuw lid oke, de nieuwe code staat er. De content div zit er gewoon omheen. En nog steeds heb ik het probleem.
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.215s