login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Verspringen in IE (Opgelost)

Offline leroyvanloon - 19/05/2010 12:59
Avatar van leroyvanloonLid Eey sitemasters,

Ik ben nu nog steeds bezig met de website van mijn gaming organisatie..

En ik stuit nu op een probleempje.

In firefox chrome ect werkt het prima. en met IE verspringen de kopjes. (Niet in compat. modes) maar dan verkracht hij de rest 



Firefox
InternetExplorer

Nu is mijn vraag, hoe los ik dit op?

php code - Bekijk de code zonder highlighting - Klap code in 
  1. <?php
  2. $characters = "100"; 
  3. $result = mysql_query("SELECT * FROM dok_v2_eduwi ORDER BY ID ASC LIMIT 0 , 6");
  4. while ($row = mysql_fetch_array($result)) {
  5. ?>
  6. <table width="100%" cellspacing="4" cellpadding="20" border="0">
  7. <tr>
  8. <td>
  9. <p> <span style="padding-left:4px"> <img src="/images/flags/<?php echo $row["flag"]; ?>.gif" /> <a href="index.php?site=watis&id=<?php echo $row["id"]; ?>"><?php echo substr($row["titel"], 0, $characters); ?></font></a><br></span></p>
  10. </td>
  11. </tr>
  12. </table>
  13. <?php } ?>

8 antwoorden

Gesponsorde links
Offline WouterPSV - 19/05/2010 13:18
Avatar van WouterPSV Lid volgens mij pakt FF de cellspacing en padding niet en IE wel
Probeer die eens op 0 te zetten wat krijg je dan ??

Het is ook netter om zoiets op te maken met Css volgens mij.
Offline Jelmerholland - 19/05/2010 13:21
Avatar van Jelmerholland PHP beginner Dit kan je beter met een <ul><li> tag in elkaar zetten.
En inderdaad, je kan beter een style="" tag gebruiken in je <table>, dat werkt sowieso beter volgens mij 
Offline leroyvanloon - 19/05/2010 13:23
Avatar van leroyvanloon Lid en dat doe ik hoe? 
Offline WouterPSV - 19/05/2010 13:24
Avatar van WouterPSV Lid Ik ben al even voor je bezig.
Zet even een bakje koffie.. en kijk over een kleine kwartiertje even weer.
Offline WouterJ - 19/05/2010 13:50
Avatar van WouterJ HTML gevorderde Je kan het best een CSS en HTML pagina maken. Als je dat wilt kunnen moet je eens hier kijken.

@Jelmerholland, je zegt vaak goede dingen maar nu zeg je toch iets verkeerd. Een style="" gebruiken in de <table> is fout. Je kan veel beter een aparte stylesheet gebruiken.

@TS, je moet inderdaad padding en margin op 0 zetten.
Offline WouterPSV - 19/05/2010 14:09 (laatste wijziging 19/05/2010 14:11)
Avatar van WouterPSV Lid Voorbeeld : Hier een idee zoals je wilt ??
ZIP File : Alle bestanden

Code: Index:
html4strict code - Bekijk de code zonder highlighting - Klap code in 
  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">
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Untitled Document</title>
  6.  
  7. <link href="main.css" rel="stylesheet" type="text/css" />
  8. </head>
  9.  
  11.   <div id="container">
  12.     <div id="header"></div>
  13.       <table id="content">
  14.         <tr>
  15.           <td id="left"> film</td>
  16.           <td id="center">&nbsp;</td>
  17.           <td id="right">
  18.  
  19.             <!-- 1 zo'n div moet je in je while lus zetten. -->
  20.             <div class="news_row">hoi</div>
  21.             <div class="news_row">hoi</div>
  22.           </td>
  23.         </tr>
  24.       </table>
  25.     <div id="footer">&nbsp;</div>
  26.   </div>
  27. </body>
  28. </html>


Main.css:
css code - Bekijk de code zonder highlighting - Klap code in 
  1. @charset "utf-8";
  2. /* CSS Document */
  3.  
  4. body				{ background:#ffffff; font-family:arial; font-size:11px; color:#000; }
  5. html, body 			{ margin:0; padding:0; }
  6.  
  7. #container 			{ width:656px; height:auto; margin:0px auto 0px; }
  8. #content			{ width:656px; height:auto; padding:0px 1px 0px 1px; background:url(bg_content.jpg) repeat-y; }
  9.  
  10. #header				{ height:35px; width:656px; background:url(header.jpg) no-repeat; }
  11. #left				{ float:left; width:206px; }
  12. #center				{ float:left; height:auto; width:7px; }
  13. #right				{ float:right; height:auto; width:428px; }
  14.   .news_row			{ width:418px; height:17px; color:#cc0000; padding:5px 5px 3px 5px; background:url(news_bg.jpg) no-repeat; }
  15.  
  16. #footer				{ clear:both; width:656px; height:6px; background:url(footer.jpg) no-repeat; }


P.S. sorry van het kwartiertje ;) kwam even wat tussendoor
Bedankt door: leroyvanloon
Offline Jelmerholland - 19/05/2010 14:47 (laatste wijziging 19/05/2010 14:49)
Avatar van Jelmerholland PHP beginner @Waldio,

Losse stylesheet is inderdaad beter, maar als jij maar 1 table hebt die je een bepaalde waarde mee wilt geven, kan je beter een style="..." gebruiken. Anders zit je weer met class en id te klooien en dat moet je 'm weer 'terugzoeken' in je stylesheet... ik vind dit onhandig als je toch maar 1 zo'n table hebt 

Voor de <tr> en <td> tags kan hij het beter wel gebruiken, omdat die steeds terug komen.
Maar het is net wat je liever hebt eigenlijk,,, maakt in principe niks uit..

@leroyvanloon
html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <ul>
  2. <!-- Begin while loop -->
  3.    <li>
  4.       <!-- Je data, staat bij jou nu in de <tr><td></td></tr> tags -->
  5.    </li>
  6. <!-- Einde while loop -->
  7. </ul>


En dan je <li> een bepaalde breedte meegeven (css) en op display:block zetten, je moet er even mee experimenteren, maar ik gebruik in zulke gevallen liever een <ul><li> familie 
(Als het zich toelaat, maar volgens mij wel)


Wat me trouwens ook opvalt, waarom maak je per loop een nieuwe table aan?
Jij hebt je:
<table>, <tr> en <td> tags in je while-loop, je kan de <table> er beter buiten houden.. dan maak je alleen maar een nieuwe rij en niet een complete table 
Hou je beter overzicht en je kan er dn beter mee 'spelen'
Offline leroyvanloon - 19/05/2010 21:08 (laatste wijziging 20/05/2010 14:09)
Avatar van leroyvanloon Lid Ja dat was om het goed te krijgen in firefox. want in firefox doet hij het dus prima, Ik ga vanavond even kijken met de post van wouter. thanks guys 

Heb het zo opgelost

css code - Bekijk de code zonder highlighting - Klap code in 
  1. #edu {width:438px; height:168px; float:left; padding:0 0 0 1px;}
  2. 	#edu #content {background: url(../_gfx/bgedu.jpg);height: 136px;width: 438px;}
  3. 	#edu #content p {line-height:22px; padding:0 5px 1px 8px; text-align:left;}
  4. 	#edu #content a {color:#333333; text-decoration:none;}
  5. 	#edu #content p img {padding-bottom:3px;}
  6. 	#edu #content a:hover {color:#cc0000; text-decoration:none;}
  7.  
  8. 			#edufilm {width:217px; height:169px; float:left;}
  9. 			#edufilm #content {background: url(../_gfx/bgcotw.jpg);height: 136px;width: 217px;}


En in php:

php code - Bekijk de code zonder highlighting - Klap code in 
  1. <div id="edufilm">
  2. 	<div id="content"><?php include("sc_eduvideo.php"); ?></div>
  3. </div>
  4.  
  5. <div id="edu">
  6. 	<div id="content"><?php include("sc_eduwatis.php"); ?></div>
  7. </div>



php code - Bekijk de code zonder highlighting - Klap code in 
  1. <p><img src="/images/flags/<?php echo $row["flag"]; ?>.gif" /> <a href="index.php?site=watis&id=<?php echo $row["id"]; ?>"><?php echo substr($row["titel"], 0, $characters); ?></font></a><br></p>



Werkt als een trein, thanks voor alle info. 
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.198s