login  Naam:   Wachtwoord: 
Registreer je!
 Forum

IMG div-probleem

Offline Flippie - 09/12/2006 22:22
Avatar van FlippieNieuw lid Heb een probleem met IMG's in een DIV. Ik plaats een img in een DIV, maar steeds wil hij daar in IE een "white space" tussenplaatsen van een 2px. Wanneer ik de banner + naviagtiebalk in een TABLE plaats, werkt alles perfect. Iemand een oplossing?
Ik probeerde al vanalles in CSS: white-space, margin, padding, zette line-height en font al eens op 1px, maar niks helpt blijkbaar.

Voorbeeld te vinden op: http://minisite.topsporters.net/helinl
Code:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. div#top {
  2. 			width: 770px;
  3. 			height: 75px;
  4. 			margin: 0px;
  5. 			padding: 0px 0px 0px 0px;
  6. 			line-height: 1px;
  7. 			font-size: 1px;
  8. 		}
  9. 		div#banner {
  10. 			float: left;
  11. 			width: 529px;
  12. 			height: 75px;
  13. 			margin: 0px;
  14. 			padding: 0px 0px 0px 0px;
  15. 			display: inline;
  16. 			line-height: 1px;
  17. 			font-size: 1px;
  18. 		}
  19. 		div#navigation {
  20. 			float: left;
  21. 			width: 241px;
  22. 			height: 75px;
  23. 			padding: 0px 0px 0px 0px;
  24. 			margin: 0px;
  25. 			padding: 0px;
  26. 			display: inline;
  27. 			line-height: 1px;
  28. 			font-size: 1px;
  29. 		}
  30.  
  31.  
  32. <div id="top">
  33. 		<div id="banner"><a href="index.php" class=""><img src="../common/images/banner.jpg" width="529" height="75" border="0" class="" alt="<? echo htmlspecialchars($sFirstname . " " . $sLastname); ?>"></a></div>
  34. 		<div id="navigation"><a href="content.php?sLangcode=<? echo $sLangcode; ?>&sPage=news&sUsername=<? echo $sUsername; ?>&iSporterID=<? echo $iSporterID; ?>" class="" onMouseOver="MM_swapImage('image1', '', '../common/images/navNews_mouseOver.jpg', 1)" onMouseOut="MM_swapImgRestore()"><img src="../common/images/navNews.jpg" width="64" height="22" alt="<? echo htmlspecialchars($sLangvarNews); ?>" border="0" class="" id="image1"></a><a href="content.php?sLangcode=<? echo $sLangcode; ?>&sPage=results&sUsername=<? echo $sUsername; ?>&iSporterID=<? echo $iSporterID; ?>" class="" onMouseOver="MM_swapImage('image2', '', '../common/images/navResults_mouseOver.jpg', 1)" onMouseOut="MM_swapImgRestore()"><img src="../common/images/navResults.jpg" width="100" height="22" alt="<? echo htmlspecialchars($sLangvarResults); ?>" border="0" class="" id="image2"></a><a href="content.php?sLangcode=<? echo $sLangcode; ?>&sPage=agenda&sUsername=<? echo $sUsername; ?>&iSporterID=<? echo $iSporterID; ?>" class="" onMouseOver="MM_swapImage('image3', '', '../common/images/navAgenda_mouseOver.jpg', 1)" onMouseOut="MM_swapImgRestore()"><img src="../common/images/navAgenda.jpg" width="77" height="22" alt="<? echo htmlspecialchars($sLangvarAgenda); ?>" border="0" class="" id="image3"></a><a href="content.php?sLangcode=<? echo $sLangcode; ?>&sPage=honourlist&sUsername=<? echo $sUsername; ?>&iSporterID=<? echo $iSporterID; ?>" class="" onMouseOver="MM_swapImage('image4', '', '../common/images/navHonourlist_mouseOver.jpg', 1)" onMouseOut="MM_swapImgRestore()"><img src="../common/images/navHonourlist.jpg" width="83" height="17" alt="<? echo htmlspecialchars($sLangvarHonourlist); ?>" border="0" class="" id="image4"></a><a href="content.php?sLangcode=<? echo $sLangcode; ?>&sPage=perfarmanceevolution&sUsername=<? echo $sUsername; ?>&iSporterID=<? echo $iSporterID; ?>" class="" onMouseOver="MM_swapImage('image12', '', '../common/images/navEvolution_mouseOver.jpg', 1)" onMouseOut="MM_swapImgRestore()"><img src="../common/images/navEvolution.jpg" width="81" height="17" alt="<? echo htmlspecialchars($sLangvarPerformanceevolution); ?>" border="0" class="" id="image12"></a><a href="content.php?sLangcode=<? echo $sLangcode; ?>&sPage=profile&sUsername=<? echo $sUsername; ?>&iSporterID=<? echo $iSporterID; ?>" class="" onMouseOver="MM_swapImage('image5', '', '../common/images/navProfile_mouseOver.jpg', 1)" onMouseOut="MM_swapImgRestore()"><img src="../common/images/navProfile.jpg" width="77" height="17" alt="<? echo htmlspecialchars($sLangvarProfile); ?>" border="0" class="" id="image5"></a><a href="content.php?sLangcode=<? echo $sLangcode; ?>&sPage=sponsors&sUsername=<? echo $sUsername; ?>&iSporterID=<? echo $iSporterID; ?>" class="" onMouseOver="MM_swapImage('image8', '', '../common/images/navSponsors_mouseOver.jpg', 1)" onMouseOut="MM_swapImgRestore()"><img src="../common/images/navSponsors.jpg" width="92" height="15" alt="<? echo htmlspecialchars($sLangvarSponsors); ?>" border="0" class="" id="image8"></a><a href="content.php?sLangcode=<? echo $sLangcode; ?>&sPage=press&sUsername=<? echo $sUsername; ?>&iSporterID=<? echo $iSporterID; ?>" class="" onMouseOver="MM_swapImage('image6', '', '../common/images/navPress_mouseOver.jpg', 1)" onMouseOut="MM_swapImgRestore()"><img src="../common/images/navPress.jpg" width="69" height="15" alt="<? echo htmlspecialchars($sLangvarPress); ?>" border="0" class="" id="image6"></a><a href="content.php?sLangcode=<? echo $sLangcode; ?>&sPage=pictures&sUsername=<? echo $sUsername; ?>&iSporterID=<? echo $iSporterID; ?>" class="" onMouseOver="MM_swapImage('image7', '', '../common/images/navPictures_mouseOver.jpg', 1)" onMouseOut="MM_swapImgRestore()"><img src="../common/images/navPictures.jpg" width="80" height="15" alt="<? echo htmlspecialchars($sLangvarPictures); ?>" border="0" class="" id="image7"></a><a href="content.php?sLangcode=<? echo $sLangcode; ?>&sPage=links&sUsername=<? echo $sUsername; ?>&iSporterID=<? echo $iSporterID; ?>" class="" onMouseOver="MM_swapImage('image9', '', '../common/images/navLinks_mouseOver.jpg', 1)" onMouseOut="MM_swapImgRestore()"><img src="../common/images/navLinks.jpg" width="52" height="21" alt="<? echo htmlspecialchars($sLangvarLinks); ?>" border="0" class="" id="image9"></a><a href="content.php?sLangcode=<? echo $sLangcode; ?>&sPage=guestbook&sUsername=<? echo $sUsername; ?>&iSporterID=<? echo $iSporterID; ?>" class="" onMouseOver="MM_swapImage('image10', '', '../common/images/navGuestbook_mouseOver.jpg', 1)" onMouseOut="MM_swapImgRestore()"><img src="../common/images/navGuestbook.jpg" width="103" height="21" alt="<? echo htmlspecialchars($sLangvarGuestbook); ?>" border="0" class="" id="image10"></a><a href="content.php?sLangcode=<? echo $sLangcode; ?>&sPage=contact&sUsername=<? echo $sUsername; ?>&iSporterID=<? echo $iSporterID; ?>" class="" onMouseOver="MM_swapImage('image11', '', '../common/images/navContact_mouseOver.jpg', 1)" onMouseOut="MM_swapImgRestore()"><img src="../common/images/navContact.jpg" width="86" height="21" alt="<? echo htmlspecialchars($sLangvarContact); ?>" border="0" class="" id="image11"></a></div></div>

2 antwoorden

Gesponsorde links
Offline MindPrison - 10/12/2006 12:19 (laatste wijziging 10/12/2006 12:21)
Avatar van MindPrison PHP gevorderde Probeer dit eens, misschien helpt het.
php code - Bekijk de code zonder highlighting - Klap code in 
  1. #top
  2. {
  3.   width: 770px;
  4.   height: 75px;
  5.   margin: 0px;
  6.   padding: 0px;
  7.   display: block; /* Dit is zelfs optioneel denk ik */
  8.   clear: both;
  9. }
  10. #banner
  11. {
  12.   float: left;
  13.   width: 529px;
  14.   height: 75px;
  15.   margin: 0px;
  16.   padding: 0px;
  17. }
  18. #navigation
  19. {
  20.   float: left;
  21.   width: 241px;
  22.   height: 75px;
  23.   padding: 0px;
  24.   margin: 0px;
  25. }
Offline CHIR - 10/12/2006 22:39
Avatar van CHIR Nieuw lid Ok, eerst ff een tip: zet je style-stuff in een CSS bestand en verwijs hiernaar in je head-gedeelte. Dit maakt het al een stuk overzichtelijker.
Dan je probleem: zo te zien is je plaatje in je #top een link ergens naar toe, dus dan moet je in je CSS aangeven dat je geen onder- (of om)lijning van je plaatje wil bij links.
Hierbij het stukje code voor CSS om dit te verhelpen (met uitleg):
php code - Bekijk de code zonder highlighting - Klap code in 
  1. a:link img, a:visited img { border-style: none; } /* no border on img links */
  2.  
  3. a img { color: transparent; }        /* trick to hide the border in Netscape 4 */
  4. @media all {                   /* hide the next rule from Netscape 4 */
  5.   a img { color: inherit; }    /* undo the color change above */
  6. }

Hoop dat hiermee je probleem is opgelost!
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.341s