login  Naam:   Wachtwoord: 
Registreer je!
 Forum

ul menu centreren

Offline robmoorman - 28/11/2008 10:09 (laatste wijziging 28/11/2008 10:10)
Avatar van robmoormanPHP interesse Hoi,

Ik zit even met een klein probleempje.
Ik heb met html/css een menubar gemaakt, werkt allemaal prima. Echter krijg ik het menu niet mooi in het midden (het liefst ook nog justifyd).

Hier mijn voorbeeld: Klik hier
Voorbeeld zoals het zou moeten zijn: Klik hier

mijn html:
html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <div id="menu">
  2.  
  3. 			<ul>
  4. 				<li><a href="#">Frontpage</a></li>
  5. 				<li class="break">
  6. 				<li><a href="#">About</a></li>
  7. 				<li class="break">
  8. 				<li><a href="#">News</a></li>
  9. 				<li class="break">
  10. 				<li><a href="#">Coverage</a></li>
  11. 				<li class="break">
  12. 				<li><a href="#">Staff</a></li>
  13. 				<li class="break">
  14. 				<li><a href="#">Matches</a></li>
  15. 				<li class="break">
  16. 				<li><a href="#">Archievements</a></li>
  17. 				<li class="break">
  18. 				<li><a href="#">Events</a></li>
  19. 				<li class="break">
  20. 				<li><a href="#">Sponsors</a></li>
  21. 			<ul>
  22.  
  23. 		</div>


mijn css:
css code - Bekijk de code zonder highlighting - Klap code in 
  1. #menu
  2. {
  3. 	text-align: center;
  4. 	float: left;
  5. 	width: 980px;
  6. 	height: 28px;
  7. 	margin-bottom: 5px;
  8. 	background: url( '../images/menu.png' ) top left repeat-x;
  9. }
  10. #menu ul
  11. {
  12. 	list-style-type: none;
  13. 	margin: 0;
  14. 	padding: 0;
  15. }
  16. #menu li
  17. {
  18. 	float: left;
  19. 	margin: 0;
  20. }
  21. #menu .break
  22. {
  23. 	display: block;
  24. 	width: 1px;
  25. 	height: 28px;
  26. 	height: 28px;
  27. 	background-color: #333333;
  28. }
  29. #menu a
  30. {
  31. 	display: block;
  32. 	width: auto;
  33. 	height: 22px;
  34. 	font-size: 10px;
  35. 	font-weight: bold;
  36. 	text-transform: uppercase;
  37. 	text-decoration: none;
  38. 	color: #eeeeee;
  39. 	padding: 6px 10px 0 10px;
  40. }
  41. #menu a:hover
  42. {
  43. 	color: #333333;
  44. 	background: url( '../images/menuHover.png' ) top left repeat-x;
  45. }


bvd, rob.

2 antwoorden

Gesponsorde links
Offline Kr4nKz1n - 28/11/2008 12:27 (laatste wijziging 28/11/2008 12:27)
Avatar van Kr4nKz1n Onbekend En als je werkt met auto bij margin en padding ?
Offline robmoorman - 28/11/2008 12:44
Avatar van robmoorman PHP interesse hm nee die pakt hij niet...
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.178s