Tabel: rijhoogte verspringt terwijl ik dat niet wil

jannetwiel · 12 mei 2006

Ik heb een website gemaakt met een nogal ingewikkelde tabel, waarbij ik een aantal cellen heb samengevoegd. Om de pret nog te verhogen, heb ik in een aantal van die cellen een geneste tabel gezet.
Volgens mij heb ik van alle cellen waarvoor dat van belang is de valign op top gezet. In eerste instantie ging dat goed ( zie eerste link hieronder). Maar nu heb ik in de 'centrale cel' de geneste tabel van 1 bij 1 veranderd in een tabel van 4 bij 5 ofzo, en nu ziet het er niet meer uit (die twee zwarte cellen zijn veel te hoog geworden). Ben ik gewoon te ver gegaan, of is de baggerlink nog te redden?

Hier gaat het nog goed:

En dit is bagger:

Voor de volledigheid hieronder de code van de baggerlink:

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0014)about:internet -->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>NOAG - visie, werkwijze, producten en diensten</title>
<link rel="stylesheet" href="../opmaak.css" type="text/css">
<script language="JavaScript" src="../noag2006.js"></script>
<meta name="Keywords" content="organisatieadviesbureau,organisatie,advies,organisatieadvies,training,implementatie,kwaliteit,visie" />
</head>
<body onload="MM_preloadImages('../knoppen/homedwn.gif','../knoppen/actueeldwn.gif','../knoppen/penddwn.gif','../knoppen/trainingdwn.gif','../knoppen/projectdwn.gif','../knoppen/contactdwn.gif','../knoppen/penodienstendwn.gif','../knoppen/financedwn.gif')">
<table width="870" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <th width="195" height="120" valign="bottom" nowrap="nowrap" bgcolor="#808080" scope="row"><h5 align="left"><span class="style16">&nbsp;<span class="style3">Organisatie adviesbureau </span></span><img src="../plaatjes/noag_logo_grijs.gif" alt="Organisatie adviesbureau NOAG" width="193" height="59" align="top" /></h5></th>
    <td height="120" colspan="2" valign="top" bgcolor="#FFFFFF"><img src="../plaatjes/strook_iip.jpg" alt="Investeren in mensen is investeren in kwaliteit" width="675" height="120" /></td>
  </tr>
  <tr>
    <th colspan="3" valign="middle" bgcolor="#808080" scope="row"><div align="left"><a href="../home.html"><img src="../knoppen/home.gif" alt="home" name="home" width="55" height="42" border="0" id="home" onmouseover="MM_swapImage('home','','../knoppen/homedwn.gif',1)" onmouseout="MM_swapImgRestore()" /></a><img src="../knoppen/overonsdwn.gif" alt="over ons" name="over_ons" width="75" height="42" border="0" id="over_ons" /><a href="../actueel/actueel.htm"><img src="../knoppen/actueel.gif" alt="actueel" name="actueel" width="65" height="42" border="0" id="actueel" onmouseover="MM_swapImage('actueel','','../knoppen/actueeldwn.gif',1)" onmouseout="MM_swapImgRestore()" /></a><a href="../producten_diensten/productendiensten.html"><img src="../knoppen/pend.gif" alt="producten &amp; diensten" name="pend" width="184" height="42" border="0" id="pend" onmouseover="MM_swapImage('pend','','../knoppen/penddwn.gif',1)" onmouseout="MM_swapImgRestore()" /></a><a href="../trainingen/trainingen.html"><img src="../knoppen/training.gif" alt="trainingen" name="training" width="114" height="42" border="0" id="training" onmouseover="MM_swapImage('training','','../knoppen/trainingdwn.gif',1)" onmouseout="MM_swapImgRestore()" /></a><a href="../projecten/projecten.html"><img src="../knoppen/project.gif" alt="projecten" name="project" width="107" height="42" border="0" id="project" onmouseover="MM_swapImage('project','','../knoppen/projectdwn.gif',1)" onmouseout="MM_swapImgRestore()" /></a><a href="../contact/contact.html"><img src="../knoppen/contact.gif" alt="contact" name="contact" width="86" height="42" border="0" id="contact" onmouseover="MM_swapImage('contact','','../knoppen/contactdwn.gif',1)" onmouseout="MM_swapImgRestore()" /></a><a href="http://www.penodiensten.nl" target="_blank"><img src="../knoppen/penodiensten.gif" alt="PenO diensten" name="peno_diensten" width="114" height="42" border="0" id="peno_diensten" onmouseover="MM_swapImage('peno_diensten','','../knoppen/penodienstendwn.gif',1)" onmouseout="MM_swapImgRestore()" /></a><a href="http://www.penofinance.nl" target="_blank"><img src="../knoppen/finance.gif" alt="Finance" name="finance" width="70" height="42" border="0" id="finance" onmouseover="MM_swapImage('finance','','../knoppen/financedwn.gif',1)" onmouseout="MM_swapImgRestore()" /></a></div></th>
  </tr>
  <tr>
    <th width="195" height="44" valign="top" bgcolor="#000000" scope="row"><div align="left" class="style5"> &nbsp;&nbsp;&nbsp;</div></th>
    <th width="491" rowspan="2" valign="top" bgcolor="#FFFFFF" scope="row"><img src="../plaatjes/grijsstrook.gif" alt="grijzestrook" width="491" height="44" align="texttop" />
      <table width="471" border="0" align="center" cellpadding="10" cellspacing="0">
        <tr valign="top">
          <th colspan="4" scope="row"><h1 align="left">Hieronder een overzicht van onze adviseurs. Klik op de foto en zij stellen zich aan u voor. </h1>          </th>
        </tr>
        <tr valign="top">
          <th width="99" scope="row"><p><img src="../plaatjes/ger_nekkers.jpg" alt="Ger Nekkers" width="99" /></p>          </th>
          <th width="97" scope="row"><div align="left">
            <p><strong>Ger Nekkers</strong><br />
              <span class="style14">senior consultant</span></p>
            </div></th>
          <th width="99" scope="row">&nbsp;</th>
          <th width="96" scope="row">&nbsp;</th>
        </tr>
        <tr valign="top">
          <th scope="row"><img src="../plaatjes/nico_strik.jpg" alt="Nico van Strik" width="99" height="131" /><br /></th>
          <th scope="row"><div align="left"><strong>Nico van Strik</strong><br />
            senior consultant
</div></th>
          <th scope="row">&nbsp;</th>
          <th scope="row">&nbsp;</th>
        </tr>
        <tr valign="top">
          <th scope="row"><img src="../plaatjes/henk_kral.jpg" width="99" height="127" /><br />
            Henk Kral </th>
          <th scope="row">&nbsp;</th>
          <th scope="row">&nbsp;</th>
          <th scope="row">&nbsp;</th>
        </tr>
        <tr valign="top">
          <th scope="row">&nbsp;</th>
          <th scope="row">&nbsp;</th>
          <th scope="row">&nbsp;</th>
          <th scope="row">&nbsp;</th>
        </tr>
      </table>      </th>
    <th width="184" height="44" align="center" valign="middle" nowrap="nowrap" bgcolor="#000000" scope="row">&nbsp;</th>
  </tr>
  <tr>
    <th width="195" valign="top" bgcolor="#E0EADF" scope="row"><table width="193" border="0" cellspacing="0" cellpadding="10">
      <tr>
        <th valign="top" scope="row"><div align="left" class="style14">
            <h1 class="style16">Over ons</h1>
            <ul>
              <li>Visie</li>
              <li>Werkwijze</li>
              <li>Producten/diensten</li>
              <li>Opdrachtgevers</li>
              <li>Onze adviseurs</li>
              <li>Werken bij ...</li>
              <li>Contact</li>
              </ul>
            <p><br />
              <br />
            </p>
        </div></th>
      </tr>
    </table>
      <div align="left"></div></th>
    <td valign="top" bgcolor="#E0EADF"><table width="184" border="0" cellpadding="10" cellspacing="0" bgcolor="#E0EADF">
      <tr>
        <th valign="top" bgcolor="#E0EADF" scope="row"><div align="left">
          <p>Veel van onze adviseurs en trainers komen zelf uit de praktijk. Zij zijn   bijvoorbeeld hoofd van een afdeling P &amp; O geweest. Zij weten dus uit eigen   ervaring met welke problemen u te maken krijgt, en hebben daar oplossingen voor   gevonden.<br />
            <br />
                <br />
          </p>
          </div></th>
      </tr>
    </table></td>
  </tr>
  <tr>
    <th width="195" bgcolor="#E0EADF" scope="row">&nbsp;</th>
    <td valign="top" bgcolor="#FFFFFF">&nbsp;</td>
    <td bgcolor="#E0EADF">&nbsp;</td>
  </tr>
  <tr>
    <th height="30" colspan="3" bgcolor="#808080" scope="row"><div align="center"><span class="style5">Organisatie adviesbureau NOAG bv&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Postbus 5206&nbsp;&nbsp;&nbsp;&nbsp;9700 GE&nbsp;&nbsp;Groningen&nbsp;&nbsp;&nbsp;Tel. (050) 542 25 34 </span></div></th>
  </tr>
</table>
</body>
</html>

peter vazed · 12 mei 2006

Rowspan en colspan kan inderdaad een niet gewenst resultaat geven.

Overigens zie ik nergens td tags staan

Hier:

Code:

	</tr>
			  
			<tr>
				  
				<th width="195" height="44" valign="top" bgcolor="#000000" scope="row">
					<div align="left" class="style5">
						 &nbsp;&nbsp;&nbsp;<font color=#ffffff>jjjjjjjjjjjjjjjjjjjjjjjjj
</font>					</div>
				</th>

zie ik th ipv td
Zet op deze plek de inhoud van de cel welke er nu onder sit.

Zet je borders in ontwerpfase op "1"
zodat je ziet wat wat doet.

jannetwiel · 12 mei 2006

Hoi Peter,

dank voor je reactie. Ik heb even moeten puzzelen wat je bedoelde, maar het voorstel om de inhoud van de cel eronder te verplaatsen zal niet werken, want die cel met zwarte actergrond moet juist leeg zijn.

Het hoort er namelijk zo uit te zien.
De code die hierboven staat levert het volgende resultaat op (Let vooral op de hoogte van die twee zwarte cellen. Die zouden veel lager moeten zijn).

Ik kom trouwens wel diverse td tags tegen in de code, maar waarschijnlijk niet op plaatsen waar jij ze verwacht? Maar ja, daar kan ik ook niks aan doen, dit is wat Dreamweaver ervan bakt.

peter vazed · 12 mei 2006

Ja, lager, dus minder hoog?
Maar:
http://www.noag.nl/test/plaatjes/grijsstrook.gif
is 44px hoog.

En de pagina is breder dan mijn beeldscherm

Kan zo niet ontdekken waar dit aan ligt.

Tabel: rijhoogte verspringt terwijl ik dat niet wil

jannetwiel

Gebruiker

peter vazed

Meubilair

jannetwiel

Gebruiker

peter vazed

Meubilair

Nieuwste berichten

Wij waarderen jouw privacy