[HTML] Table verkeerde td rekt

Pagina: 1
Acties:

  • DJH
  • Registratie: Oktober 2000
  • Laatst online: 28-03 00:05
Ik ben bezig met een lay-out van een website. Ik zit echter met een probleempje. Voor de duidelijkheid heb ik even een screenshot gemaakt:

Afbeeldingslocatie: http://www.xs4all.nl/~djh/pics/tweakah.jpg

Je ziet aan beide kanten een gradient achtergrond, daaronder nog 2 lege witte cellen. In de midden komt de tekst, als de tekst langer is dan wat IE op 1 pagina kan laten zien moeten de 'witte cellen' onder gaan rekken en niet de cellen met de gradient achtergrond. Hoe krijg ik dat zo? Hier is de source:

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<HTML>
 <HEAD>
  <TITLE>AH Wassenaar -- Sint Annaparochie --</TITLE>
  <link rel="stylesheet" href="ahstyle.css">
  <script src="ahscript.js" type="text/javascript" language="Javascript"></script>
 </HEAD>
 <BODY bgcolor="#3399CC" marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0">
  <table border="0" cellspacing="0" cellpadding="0" width=100% height=100%>
   <tr>
    <td colspan="3" align="center" height="100" background="pics/backso.gif">[img]"pics/ahlogo1.jpg"></td>
[/img]
   <tr>
    <td colspan="3" align="center" valign="middle" height="30" background="pics\backl.jpg">
     <a href="home.php"><b>:: H</b>ome <b>::</b></a>&nbsp;&nbsp;&nbsp;&nbsp;
     <a href="prod.php"><b>:: P</b>roducten <b>::</b></a>&nbsp;&nbsp;&nbsp;&nbsp;
     <a href="handig.php"><b>:: H</b>andig <b>::</b></a>&nbsp;&nbsp;&nbsp;&nbsp;
     <a href="contact.php"><b>:: C</b>ontact <b>::</b></a>&nbsp;&nbsp;&nbsp;&nbsp;
    </td>
   </tr>
   <tr>
    <td background="pics/backso.jpg" width="*" height="538"></td>   
    <td align="center" width="700" height="100%" background="pics/middleback.jpg" rowspan="2"><span class="tekst">
        [img]"pics/ah_logo.gif"><br><br><br><br><br><br>
[/img]<br><br><br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br><br>TEST</span></td>   
    <td background="pics/backso.jpg" width="*" height="538"></td>
   </tr>
   <tr>
    <td height="*" bgcolor=white>&nbsp;</td>   <!-- DEZE MOETEN DUS REKKEN -->
    <td height="*" bgcolor=white>&nbsp;</td>   <!-- DEZE MOETEN DUS REKKEN -->
   </tr>
  </table>
 </BODY>
</HTML>



Sorry van de vele 'br en', heb ik even gedaan om de middelste cel lang te krijgen :)

  • Steven
  • Registratie: December 2000
  • Laatst online: 12-08 09:30
Zet die 2 gradient cellen in een aparte tabel die je zo hoog mogelijk uitlijnt in de hoofdtabel.

Zoiets dus:

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<table>
 <tr>
  <td valign=top>
   <table>
    <tr>
     <td>Gradient cel</td>
    </tr>
    <tr>
     <td>Gradient cel2</td>
    </tr>
   </table>
   </td>
   <td> - hoofdtekst</td>
  <td valign=top>
   <table>
    <tr>
     <td>Gradient cel</td>
    </tr>
    <tr>
     <td>Gradient cel2</td>
    </tr>
   </table>
   </td>
  </tr>
</table>

  • André
  • Registratie: Maart 2002
  • Laatst online: 19-08 12:30

André

Analytics dude

Zet de achtergrondkleur van die 2 cellen op wit en de background-repeat-y op 1.

  • DJH
  • Registratie: Oktober 2000
  • Laatst online: 28-03 00:05
Steven schreef op 17 August 2003 @ 16:03:
Zet die 2 gradient cellen in een aparte tabel die je zo hoog mogelijk uitlijnt in de hoofdtabel.

Zoiets dus:

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<table>
 <tr>
  <td valign=top>
   <table>
    <tr>
     <td>Gradient cel</td>
    </tr>
    <tr>
     <td>Gradient cel2</td>
    </tr>
   </table>
   </td>
   <td> - hoofdtekst</td>
  <td valign=top>
   <table>
    <tr>
     <td>Gradient cel</td>
    </tr>
    <tr>
     <td>Gradient cel2</td>
    </tr>
   </table>
   </td>
  </tr>
</table>
Jouw principe heb ik snel even toegepast en dat werkt! Zo heb ik het nu:
code:
1
2
3
4
5
6
7
8
9
10
        <td valign="top" width="*">    
       <table border="0" cellspacing="0" cellpadding="0" width=100% height=100%>
        <tr>
         <td height="538" background="pics/backso.jpg"></td>
        </tr>
        <tr>
         <td height="*" bgcolor=white></td>
        </tr>
       </table>    
    </td>

  • DJH
  • Registratie: Oktober 2000
  • Laatst online: 28-03 00:05
André schreef op 17 August 2003 @ 16:12:
Zet de achtergrondkleur van die 2 cellen op wit en de background-repeat-y op 1.
Welke taal is dit?

CSS dus, zal me hier ook eens in verdiepen!

[ Voor 11% gewijzigd door DJH op 17-08-2003 16:26 . Reden: antwoord opgezocht :) ]


  • dArtagnan
  • Registratie: Mei 2002
  • Laatst online: 15-07 20:09

dArtagnan

Een voor allen, allen voor een

DJH schreef op 17 augustus 2003 @ 16:23:
[...]


Welke taal is dit?

CSS dus, zal me hier ook eens in verdiepen!
http://www.w3schools.com/css/css_background.asp
Pagina: 1