login  Naam:   Wachtwoord: 
Registreer je!
 Forum

IE7 Lijst margin/padding (Opgelost)

Offline Tuinstoel - 18/03/2010 21:56
Avatar van TuinstoelPHP expert De onderstaande code werkt prima in alle browsers behalve in IE7 en lager offcourse, maar die eerstgenoemde moet helaas wel ondersteund worden. Je krijgt dan rare verschijnselen als hieronder (te veel ruimte boven een UL element denk ik), maar ik krijg het niet weg ondanks alle margins en paddings.
Zie IE7 voorbeeld: http://www.renewillemsen.nl/dump/ulruimte.PNG

HTML:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <div id="product_menu">
  2. 	<ul>
  3. 		<li class="product_cat">Buiten</li>
  4. 		<li>
  5. 			<ul>
  6. 				<li class="product_cat">Schermen</li>
  7. 				<li><ul class="lijst_producten">
  8. 						<li><a href="?pagina=producten&amp;item=3">Knikarmschermen</a></li>
  9. 						<li><a href="?pagina=producten&amp;item=2">Markiezen</a></li>
  10. 						<li><a href="?pagina=producten&amp;item=1">Screens</a></li>
  11. 						<li><a href="?pagina=producten&amp;item=7">Uitvalschermen</a></li>
  12. 				</ul></li>
  13. 			</ul>
  14. 		</li>
  15. 	</ul>
  16. </div>


CSS:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. #product_menu {
  2. 	position: relative;
  3. 	float: left;
  4. 	margin-left: -7px;
  5. 	width: 180px;
  6. 	background-color: #ccf0e2;
  7. 	font-size: 13pt;
  8. 	display: block;
  9. }
  10.  
  11. #product_menu ul {
  12. 	margin: 0;
  13. 	padding: 0;
  14. 	padding-bottom: 3px;
  15. 	padding-left: 7px;
  16. 	padding-top: 0;
  17. 	list-style-type: none;
  18. }
  19.  
  20. #product_menu li {
  21. 	font-family:  Cambria, "Times New Roman", Times, serif;
  22. 	line-height: normal;
  23. 	margin:0;
  24. 	list-style-type: none;
  25. 	padding: 0;
  26. 	padding-top: 0;
  27. }
  28.  
  29. div#product_content {
  30. 	margin-left: 200px;
  31. 	margin-top: 0px;
  32. }
  33.  
  34. ul.lijst_producten li a {
  35. 	font-family: Calibri, "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
  36. 	font-weight: none;
  37. 	display: block;
  38. 	padding-top: 0;
  39. }

3 antwoorden

Gesponsorde links
Offline vinTage - 18/03/2010 22:01
Avatar van vinTage Nieuw lid mss heb je het wel gedaan, maar het is best als je gewoon begint met ALLE margins en paddings op 0 te zetten:

css code - Bekijk de code zonder highlighting - Klap code in 
  1. *{
  2.     margin: 0;
  3.     padding: 0;
  4. }
Offline Tuinstoel - 18/03/2010 22:04
Avatar van Tuinstoel PHP expert Hmm ik had het nog niet gedaan, maar nu ik het even geprobeerd heb, brengt het niet het gewenste resultaat.
Ik word echt gek van al die stomme oude browsers, bah, kan me beter richten op programmeren .
Offline vinTage - 18/03/2010 22:07 (laatste wijziging 18/03/2010 22:21)
Avatar van vinTage Nieuw lid en als je van regel 20: #product_menu li {...
eens dit maakt:

#product_menu ul li {...


EDIT: (ie whitespace bug)
Hiermee klopt het wel 

css code - Bekijk de code zonder highlighting - Klap code in 
  1. #product_menu li {
  2.     font-family:  Cambria, "Times New Roman", Times, serif;
  3.     line-height: normal;
  4.     margin:0;
  5.     list-style-type: none;
  6.     padding: 0;
  7.     padding-top: 0;
  8. display: block;
  9. float: left;
  10. clear: left;
  11. }
Bedankt door: Tuinstoel
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.426s