Tabellen zien er niet uit in IE

Stinuz · 2 mei 2007

Hoi, ik heb hier een code om berichten die gebruikers achter te laten te weergeven. De site is gebaseerd op PHP / MYSQL maar het gaat hier om een stukje HTML code. In firefox ziet het er goed uit, als volgt namelijk:

Alleen in Internet Explorer ziet het er niet uit!

Dit is de code waar het om gaat:

HTML:

<center><table id="post1934116" class="tborder" align="center" border="0" cellpadding="6" cellspacing="0" width="90%">
<tbody><tr>
		<td class="tfoot" style="border-style: solid none solid solid; border-color: rgb(128, 151, 176) -moz-use-text-color rgb(128, 151, 176) rgb(128, 151, 176); border-width: 1px 0px 1px 1px; font-weight: normal;">		
			<!-- status icon and date -->

			'. $date .'
			<!-- / status icon and date -->				
		</td>
		<td class="tfoot" style="border-style: solid solid solid none; border-color: rgb(128, 151, 176) rgb(128, 151, 176) rgb(128, 151, 176) -moz-use-text-color; border-width: 1px 1px 1px 0px; font-weight: normal;" align="right">
			&nbsp;
			#'. $counter .' '; 
			  $counter++;  
echo '  

		&nbsp;
		</td>
</tr>
<tr valign="top">
	<td class="alt2" style="border-style: none solid; border-color: -moz-use-text-color rgb(128, 151, 176); border-width: 0px 1px;" width="175">

			<div id="postmenu_1934116">
				<b>'. $name .'</b>
			</div>
				<div>    </div>
			</div>					
	</td>
	<td class="alt3" id="td_post_1934116" style="border-right: 1px solid rgb(128, 151, 176);">	
			<!-- icon and title -->
			<div class="smallfont">
				<strong>'. $title .'</strong>
			</div>
			______________<br>'. $message .'
			<!-- / icon and title -->
<tr>
	<td class="alt2" style="border: 1px solid rgb(128, 151, 176);" align="right">
&nbsp;
</td>
	<td class="alt2" style="border-style: solid solid solid none; border-color: rgb(128, 151, 176) rgb(128, 151, 176) rgb(128, 151, 176) -moz-use-text-color; border-width: 1px 1px 1px 0px;" align="right">

Wat gaat hier mis en hoe kan ik het fixen?

peter vazed · 2 mei 2007

In je class kijken.
text-align:left;
toevoegen.

Stinuz · 2 mei 2007

Ok dat werkt, maar het isn iet alleen dat de text gecentreerd wordt, ik mis in IE ook een hele hoop lijntjes van de tabellen... die zijn gewoon wit terwijl ze in Firefox gewoon blauw zijn

peter vazed · 2 mei 2007

Je hebt
-moz-use-text-color rgb(
waarom niet gewoon
border-color:#c0c0c0;

Egel · 2 mei 2007

PHP:

<style type="text/css">
 table { background: rgb(128,151,176);}
 td { background: #fff;}
</style>

<table cellspacing="1" ...>

... en verder géén styles in de td's.

Vr.Gr. Egel.

P.s.: om de bovenste rij één geheel te maken gebruik je dan:

PHP:

<tr>
 <td class="tfoot" colspan="2" align="right">
  <span style="float: left;">
   <!-- status icon and date -->
    $icon $date
   <!-- / status icon and date -->
  </span>
  $counter
 </td>
</tr>

Stinuz · 2 mei 2007

Hey Engel, als ik jou manier uitprobeer werkt het niet.. misschien omdat ik al gebruik maak van een stylesheet? Hoe kan ik dit implementeren? Heb hier helemaal geen ervaring mee

Egel · 2 mei 2007

Dan zet je deze regels in het stylesheet waar je al gebruik van maakt:

PHP:

table.tborder { background: rgb(128,151,176);}
table.tborder td { background: #fff;}

Is het een gelinkt stylesheet of intern? Post anders even het stylesheet of de hele php-pagina als het niet lukt.

Vr.Gr. Egel.

Stinuz · 2 mei 2007

Ik krijg het niet voor elkaar

Hier de stylesheet en PHP pagina:

styles.css

Code:

/* Global */
body {
	background-color:#ffcc99;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:13px;
	margin-bottom:0;
	color:#333;
}
a {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#FF9900;
}
a:hover { 
	text-decoration:none; 
}
p {
	color:#333;
}
blockquote { 
	border:1px solid #DDD;
	background-color:#f2f2ff;
	color:#DE7008;
}
code { 
	border:1px solid #DDD;
	background-color:#F2F2F2;
	padding:12px 5px;
	font-family:"Courier New", Courier, monospace;
	font-size:14px;
	margin:0 0 0 8.5%;
	letter-spacing:+1px;
}
/* Main layout */
div#container {
	margin-left:auto;
	margin-right:auto;
	width:700px;
	background-color:#FFFFFF;
}

/* Header and nav */
div#header {
	height:50px;
	width:700px;
	clear:both;
	padding:0 0 20px 0;
	background-color:#DE7008;
}
div#header h1 {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#333;
	margin:0;
	float:left;
	font-weight:normal;
	padding:21px 0 0 17px;
}
div#header h2 {
	font-family:Georgia, "Times New Roman", Times, serif;
	color:#333;
	margin:0;
	float:left;
	font-size:11px;
	font-weight:normal;
	padding:29px 0 0 12px;
}
span.o { color:#FF9900; }
span.db { color:#333333; }
div#nav ul {
	list-style-type:none;
	width:690px;
	margin:0;
	padding:8px 0px 10px 10px;
	height:25px;
	background-color:#F5E39E;
}
div#nav ul li {
	display:inline;
}
div#nav ul li a {
	display:block;
	padding:5px 7px 5px 7px;
	float:left;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	color:#DE7008;
	text-decoration:none;
	font-size:12px;
}
div#nav ul li a:hover {
	background-color:#FF9900;
}

/* Content */
.clr { clear:both; }
div#content {
	width:700px;
}
div#main {
	float:left;
	width:683px;
}
div#main h1 {
	margin:10px 0 0 7px;
	padding:0;
	width:100%;
	text-align:left;
	font-size:25px;
	color:#333;
	font-weight:normal;
}
div#main h2 { 
	font-size:20px;
	margin:0 0 0 10px;
	font-weight:normal;
}
div#main p {
	font-size:13px;
	color:#333;
	margin:9px 0 8px 9px;
	padding:0;
}
div#main a { 
	font-weight:bold; 
}

/* Sidebar */
div#sidebar {
	float:right;
	width:160px;
	height:600px;
	padding-top:0px;
	background-color:#F2F2F2;
}
div#sidebar a { 
	color:#333;
}
div#sidebar a:hover {
	color:#FF6600;
}
div#sidebar h1 {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:21px;
	color:#333333;
	font-weight:normal;
	text-decoration:underline;
}
div#sidebar ul {
	list-style-type:square;
	margin:10 0 0 0px;
	padding:10 0 0 0px;
}
div#sidebar p {
	padding:5px 0 5px 3px;
	margin:0;
}
div#sidebar form {
	border:1px solid #ddd;
	background-color:#F2F2F2;
	padding:5px 2px 5px 2px;
	margin:0;
}

/* Footer */
div#footer {
	width:700px;
	border-top:1px solid #333;
	background-color:#666;
	padding:3px 0 3px 0;
}
div#footer p {
	text-align:center;
	width:100%;
	margin:0;
	padding:0;
	font-size:11px;
	color:#FFF;
}
div#footer a {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#FFFFFF;
}
div#footer a:hover { 
	color:#FF9900;
	text-decoration:none; 
}

guide.php

PHP:

<?php

include("config.php");

include("header.php");

if(isset($_GET['id']) && is_numeric($_GET['id']))
{
  // Download details
  $detailQuery = "SELECT * FROM guides WHERE id='$_GET[id]'";
  $detailResult = mysql_query($detailQuery) or die (mysql_error());
  if(mysql_num_rows($detailResult) == 0)
  {
      //Foutmelding bij een ingevoerde ID die niet bestaat
    echo "No results found.";
  }
  else
  {
    while($detailRow = mysql_fetch_array($detailResult))
    {
      extract($detailRow); 
    $content = nl2br("$content");
    $note = nl2br("$note");
      echo '<h2>'. $guidename .'</h2>
<br>
<center>
<script type="text/javascript"><!--
google_ad_client = "pub-0485299615174772";
google_ad_width = 468;
google_ad_height = 60;
google_ad_format = "468x60_as";
google_ad_type = "text";
google_ad_channel = "";
//-->
</script>
<script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</center>

		<ul>
		'. $guidename .'<br>
           By: '. $name .'<br>
<img src=images/classes/'. $classes .'.jpg border=0><br>
           '. $content .'<br><br>

<center><script type="text/javascript"><!--
google_ad_client = "pub-0485299615174772";
google_ad_width = 468;
google_ad_height = 60;
google_ad_format = "468x60_as";
google_ad_type = "image";
google_ad_channel = "";
//-->
</script>
<script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></center><br>

           '. $note .'
		</ul>
';
    }

echo '

<h2>Comments</h2>';

$counter = 1;


$tabelQuery = "SELECT * FROM guestbook WHERE number='$_GET[id]' ORDER BY id asc";
$tabelResult = mysql_query($tabelQuery) or die (mysql_error());

echo '

<br><br>
 ';

  while($tabelRow = mysql_fetch_array($tabelResult))
  {
    extract($tabelRow); 
    $message = nl2br("$message");
echo'

<center><table id="post1934116" class="tborder" align="center" border="0" cellpadding="6" cellspacing="0" width="90%">
<tbody><tr>
		<td class="tfoot" style="border-style: solid none solid solid; border-color: rgb(128, 151, 176) -moz-use-text-color rgb(128, 151, 176) rgb(128, 151, 176); border-width: 1px 0px 1px 1px; font-weight: normal;">		
			<!-- status icon and date -->

			'. $date .'
			<!-- / status icon and date -->				
		</td>
		<td class="tfoot" style="border-style: solid solid solid none; border-color: rgb(128, 151, 176) rgb(128, 151, 176) rgb(128, 151, 176) -moz-use-text-color; border-width: 1px 1px 1px 0px; font-weight: normal;" align="right">
			&nbsp;
			#'. $counter .' '; 
			  $counter++;  
echo '  

		&nbsp;
		</td>
</tr>
<tr valign="top">
	<td class="alt2" style="border-style: none solid; border-color: -moz-use-text-color rgb(128, 151, 176); border-width: 0px 1px;" width="175">

			<div id="postmenu_1934116" align="left">
				<b>'. $name .'</b>
			</div>
				<div>    </div>
			</div>					
	</td>
	<td class="alt3" id="td_post_1934116" style="border-right: 1px solid rgb(128, 151, 176);" align="left">	
			<!-- icon and title -->
			<div class="smallfont">
				<strong>'. $title .'</strong>
			</div>
			______________<br>'. $message .'
			<!-- / icon and title -->
<tr>
	<td class="alt2" style="border: 1px solid rgb(128, 151, 176);" align="left">
&nbsp;
</td>
	<td class="alt2" style="border-style: solid solid solid none; border-color: rgb(128, 151, 176) rgb(128, 151, 176) rgb(128, 151, 176) -moz-use-text-color; border-width: 1px 1px 1px 0px;" align="left">
		<!-- / controls -->';

echo'



</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table><br></center>

';
  }
  }

}

?>

<?php

include("config.php");

$tabelQuery = "SELECT * FROM guides WHERE id='$_GET[id]' ORDER BY id desc";
$tabelResult = mysql_query($tabelQuery) or die (mysql_error());

echo'

  </center>
  <html>
   <head><title>Profiel</title></head>
   <body>

<h3>Add a comment</h3><br>

<table class="tborder" align="center" border="0" cellpadding="6" cellspacing="0" width="90%">



<tr>
	<td class="alt2" style="border: 1px solid rgb(128, 151, 176);" align="center">



    <form action="processmessage.php?id='. $_GET['id'] .'" method="POST">

     Name:<br><input type="text" name="name" /><br>
     Title:<br><input type="text" name="title" /><br>
     Message:<br><textarea name="message" cols="35" rows="6" id="message"></textarea /><br>


     <input type="submit" value="Submit" name="submit" /><br /><br />
    </form>';


echo'


</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table><br></center>';

include("footer.php"); ?>

Mijn dank is groot als je hier even naar wilt kijken

P.S. Er wordt naar de stylesheet verwezen in header.php

Egel · 3 mei 2007

Deze regels zet je aan het einde van styles.css:

PHP:

table.tborder { background: rgb(128,151,176);}
table.tborder td { background: #fff;}
table.tborder td hr { text-align: left; width: 175px; height: 1px; color: rgb(128,151,176);}

en dan moet je de tabel nog wat aanpassen, dit is een voorbeeld php:

PHP:

<style type="text/css">
 body { background: #e5eef6;}
 table.tborder { background: rgb(128,151,176);}
 table.tborder td { background: #fff;}
 table.tborder td hr { text-align: left; width: 175px; height: 1px; color: rgb(128,151,176);}
</style>

<center>

<?php
 $date = "070503";
 $counter = 1;
 $name = "Hedgehog";
 $title = "php";
 $message = "Lijntjes met een stylesheet. ;)";

 for ($i = 0; $i < 5; $i++) {

  echo '
  <table id="post1934116" class="tborder" align="center" border="0" cellpadding="6" cellspacing="1" width="90%">
   <tbody><tr>
    <td class="tfoot" colspan="2" align="right">
     <!-- status icon and date -->
      <span style="float: left;">'. $date .'</span>
     <!-- / status icon and date -->
      #'. $counter++ .' &nbsp;
    </td>
   </tr>
   <tr valign="top">
    <td class="alt2" width="175">
     <div id="postmenu_1934116">
      <b>'. $name .'</b>
     </div>
    </td>
    <td class="alt3" id="td_post_1934116">
      <!-- icon and title -->
       <div class="smallfont">
        <strong>'. $title .'</strong>
       </div>
       <hr>
       '. $message .'
      <!-- / icon and title -->
     </td>
    </tr>
    <tr>
     <td class="alt2">
      &nbsp;
    </td>
    <td class="alt2">
     <!-- / controls -->
    </td>
   </tr></tbody>
  </table>
  <br>

';

  };

?>

cellspacing="1" zorgt voor het randje,
<span style="float: left;"> zet de datum links in het bovenste vakje, en
$counter++ kan rechtstreeks in de echo

,
<hr> geeft een mooier lijntje dan de underscore's,
en ik heb nog een tr en td afgesloten de dat nog niet waren.

Dat ziet er zo uit in html:

PHP:

<style type="text/css">
 body { background: #e5eef6;}
 table.tborder { background: rgb(128,151,176);}
 table.tborder td { background: #fff;}
 table.tborder td hr { text-align: left; width: 175px; height: 1px; color: rgb(128,151,176);}
</style>

<center>


  <table id="post1934116" class="tborder" align="center" border="0" cellpadding="6" cellspacing="1" width="90%">
   <tbody><tr>
    <td class="tfoot" colspan="2" align="right">
     <!-- status icon and date -->
      <span style="float: left;">070503</span>
     <!-- / status icon and date -->
      #1 &nbsp;
    </td>
   </tr>
   <tr valign="top">
    <td class="alt2" width="175">
     <div id="postmenu_1934116">
      <b>Hedgehog</b>
     </div>
    </td>
    <td class="alt3" id="td_post_1934116">
      <!-- icon and title -->
       <div class="smallfont">
        <strong>php</strong>
       </div>
       <hr>
       Lijntjes met een stylesheet. ;)
      <!-- / icon and title -->
     </td>
    </tr>
    <tr>
     <td class="alt2">
      &nbsp;
    </td>
    <td class="alt2">
     <!-- / controls -->
    </td>
   </tr></tbody>
  </table>
  <br>


  <table id="post1934116" class="tborder" align="center" border="0" cellpadding="6" cellspacing="1" width="90%">
   <tbody><tr>
    <td class="tfoot" colspan="2" align="right">
     <!-- status icon and date -->
      <span style="float: left;">070503</span>
     <!-- / status icon and date -->
      #2 &nbsp;
    </td>
   </tr>
   <tr valign="top">
    <td class="alt2" width="175">
     <div id="postmenu_1934116">
      <b>Hedgehog</b>
     </div>
    </td>
    <td class="alt3" id="td_post_1934116">
      <!-- icon and title -->
       <div class="smallfont">
        <strong>php</strong>
       </div>
       <hr>
       Lijntjes met een stylesheet. ;)
      <!-- / icon and title -->
     </td>
    </tr>
    <tr>
     <td class="alt2">
      &nbsp;
    </td>
    <td class="alt2">
     <!-- / controls -->
    </td>
   </tr></tbody>
  </table>
  <br>


  <table id="post1934116" class="tborder" align="center" border="0" cellpadding="6" cellspacing="1" width="90%">
   <tbody><tr>
    <td class="tfoot" colspan="2" align="right">
     <!-- status icon and date -->
      <span style="float: left;">070503</span>
     <!-- / status icon and date -->
      #3 &nbsp;
    </td>
   </tr>
   <tr valign="top">
    <td class="alt2" width="175">
     <div id="postmenu_1934116">
      <b>Hedgehog</b>
     </div>
    </td>
    <td class="alt3" id="td_post_1934116">
      <!-- icon and title -->
       <div class="smallfont">
        <strong>php</strong>
       </div>
       <hr>
       Lijntjes met een stylesheet. ;)
      <!-- / icon and title -->
     </td>
    </tr>
    <tr>
     <td class="alt2">
      &nbsp;
    </td>
    <td class="alt2">
     <!-- / controls -->
    </td>
   </tr></tbody>
  </table>
  <br>


  <table id="post1934116" class="tborder" align="center" border="0" cellpadding="6" cellspacing="1" width="90%">
   <tbody><tr>
    <td class="tfoot" colspan="2" align="right">
     <!-- status icon and date -->
      <span style="float: left;">070503</span>
     <!-- / status icon and date -->
      #4 &nbsp;
    </td>
   </tr>
   <tr valign="top">
    <td class="alt2" width="175">
     <div id="postmenu_1934116">
      <b>Hedgehog</b>
     </div>
    </td>
    <td class="alt3" id="td_post_1934116">
      <!-- icon and title -->
       <div class="smallfont">
        <strong>php</strong>
       </div>
       <hr>
       Lijntjes met een stylesheet. ;)
      <!-- / icon and title -->
     </td>
    </tr>
    <tr>
     <td class="alt2">
      &nbsp;
    </td>
    <td class="alt2">
     <!-- / controls -->
    </td>
   </tr></tbody>
  </table>
  <br>


  <table id="post1934116" class="tborder" align="center" border="0" cellpadding="6" cellspacing="1" width="90%">
   <tbody><tr>
    <td class="tfoot" colspan="2" align="right">
     <!-- status icon and date -->
      <span style="float: left;">070503</span>
     <!-- / status icon and date -->
      #5 &nbsp;
    </td>
   </tr>
   <tr valign="top">
    <td class="alt2" width="175">
     <div id="postmenu_1934116">
      <b>Hedgehog</b>
     </div>
    </td>
    <td class="alt3" id="td_post_1934116">
      <!-- icon and title -->
       <div class="smallfont">
        <strong>php</strong>
       </div>
       <hr>
       Lijntjes met een stylesheet. ;)
      <!-- / icon and title -->
     </td>
    </tr>
    <tr>
     <td class="alt2">
      &nbsp;
    </td>
    <td class="alt2">
     <!-- / controls -->
    </td>
   </tr></tbody>
  </table>
  <br>

Misschien werkt de <hr> niet zo mooi met Firefox en Opera, maar dat is zo weer te veranderen.

Vr.Gr. Egel.

Stinuz · 4 mei 2007

Nou Egel, het ziet er echt al stukken beter uit! Het enige probleem is nu nog, zoals je zelf al zei, dat <HR> er niet uitziet in FF. De lijn is veel te dik en staat in het midden in plaats van links, in IE ziet hij er wel goed uit en staat ook gewoon uitgelijnd naar links. Is er nog een alternatief?

Thx voor de hulp :thumb:

Stinuz · 4 mei 2007

Heb het al gevonden... <hr> gewoon vervangen door ______________<br>

Weer een vraag opgelost

Tabellen zien er niet uit in IE

Stinuz

Terugkerende gebruiker

peter vazed

Meubilair

Stinuz

Terugkerende gebruiker

peter vazed

Meubilair

Egel

Terugkerende gebruiker

Stinuz

Terugkerende gebruiker

Egel

Terugkerende gebruiker

Stinuz

Terugkerende gebruiker

Egel

Terugkerende gebruiker

Stinuz

Terugkerende gebruiker

Stinuz

Terugkerende gebruiker

Nieuwste berichten

Wij waarderen jouw privacy