Printable View
Hi
I need help with tables.
I want to make the boxes on the left side (see my homepage: http://horazio.webs.com) all with the same exact height.
It looks almost right on IE (only the last box is a bit taller), but if I use Chrome or other browsers it doesnt look right anymore...
How can I make all the boxes with the same height for all browsers ?
thanks in advance 4 yr help
it might be helpful to post your code. In general, IE is pretty lax with how it validates your code where as Firefox, and possibly Chrome, is not. For example, in IE you don't have to specify units in your style (ie: style="width:12; height:50") but Firexfox requires some unit (ie: style="width:12px; height:50px") . However, it's hard to know for sure as you neglected to post the code you wrote.
the code is the plain html page from the link I provided
Two things: First, speaking from my own personal point of view, I would surmise most people do not want to surf to an outside web page to view the source of your site, not just because it's inconvenient but also for security concerns. I actually did try to view your site but it is blocked by my work computer. Second, no one wants to dig through all your html to find the relevant code. Instead, you should post only the relevant code that is a part of your question. In your case, post the code for the table and any CSS styles that apply. You will find more people are willing to help when you take the initiative to make helping as easy as possible.
<HTML><HEAD>
<title>Horazio's Website</title>
</HEAD>
<BODY text=#ffffff link=#ffffff alink=#ffffff bgcolor=#000033 vlink=#ffffff>
<FONT face=arial>
<center>
<TABLE BORDER=1 width="95%" height="95%">
<center>
<TR>
<TD width="20%" align=center>
<b><A HREF="https://www.facebook.com/pages/Horazios-Software/141718325951472">FACEBOOK</a></b>
</TD>
<TD rowspan=8 align=center >
<p></p>
<h2>
Software per la scuola
<p></p>
<iframe width="420" height="300" src="http://www.youtube.com/embed/GI1CvjdcT4M" frameborder="0" allowfullscreen></iframe>
<p></p>
IT Resources for school
</h2>
<p></p>
</TD>
</TR>
<tr>
<td align=center><b><a href="horazio.htm">AUTHOR</a></b></td>
</tr>
<tr>
<td align=center><b><a href="info.htm">TECH.INFO</a></b></td>
</tr>
<tr>
<td align=center><b><a href="software.htm">SOFTWARE</b></a></td>
</tr>
<tr>
<td align=center><b><a href="disclaimer.htm">LEGAL</b></a></td>
</tr>
<tr>
<td align=center>
<a href="http://horazio.webs.com/contact.htm?forumID=34597&page=1"><b>FORUM</b></a>
</td>
</tr>
<tr>
<td align=center><b>
<a href="activate.htm">ACTIVATE</a></td></b>
</tr>
<tr>
<TD align=center>
<b>
<a href="mail.htm">MAIL</a></b></td>
</tr>
</center>
</TABLE>
<p></p>
</html>
The problem with this is that the height of the last box (the one that contains the link MAIL) is unpredictable. Sometimes It has the right proportions othertimes it's way bigger
I cant understand how to fix it
The problem appears to be that you are not actually specifying what the height of each <TD> is. When you leave it blank, you leave it up to the browser to decide how each <td> should be sized. Get into the habit of using styles for your tables, and in fact for your entire web page. Every element on your page (tables, table cells, images, words, etc) have associated styles which you can manipulate. In this case, add this style to each <TD>: style="height:10px;". It should look something like this: <TD style="height:100px;">. you can change that number to whatever you want. just make sure each cell has the same value
i did that but nothing changes... I give up, thanks anyway