Strange <table> behaviour

F

Francisco Ramos

Hello all

I'm getting a very strange behaviour with my <table> html elements when
designing my aspx.
See this screenshot:
http://personales.gestion.unican.es/ramosf/strangetables.jpg

This screen is formed by several frames. The top table has 2 rows, one being
100% with (correct) and one row of four <td>, with the first three having
their width parameter fixed (to 80, 250 and 228 pixels). In Visual Studio
2005 I see it right, but when I run it locally, or publish to another server,
it shows like in the screenshot.
The same happens more or less with the height of the bottom frame o_O

Here is the code of the top table, if it helps (only the design part, and
i've removed some javascripts)

Thanks a lot in advance

Francisco Ramos






<html>
<!--
Estilos aplicados


-->
<head>
<meta http-equiv="Content-Language" content="es">
<title>cabecera</title>


</head>

<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0"
marginwidth="0" marginheight="0" style="text-align: center">

<table width="100%" id="table1" bgcolor="#195963" height="125">
<tr height="37">
<td height="37" colspan="4" bgcolor="#F2A910">
<p align="center">
<img border="0" src="images/cabecera.png" width="600" height="35"></td>
</tr>
<tr height="80px">
<td height="80" width="80" style="height: 80px">
<img border="0" name="imguc" src="images/logoweb.jpg" width="78"
height="78"></td>
<td height="80" width="250" align="center"><div align="center">
<table border="1" width="97%" id="table2" cellspacing="1" cellpadding="0"
height="76" bordercolor="#FFFFFF" style="border-collapse: collapse">
<tr>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='planes.aspx'"
class="cabecera" id="id1" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/libro.gif'">CURSOS
</a>
</td>
<td bgcolor="#195963" align="center"><b>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/presentacion.aspx'"
class="cabecera" id="id2" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/presen.gif'">PRESENTACION</a></b></td>
</tr>
<tr>
<td><b>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/ayuda.aspx'"
class="cabecera" id="id3" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/ayuda.gif'">AYUDA</a></b></td>
<td width="50%"><b>
<a href="http://www.cefont.unican.es" target="_top" class="cabecera"
id="id4" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/cefont_blancoverde.gif'">CeFoNT</a></b></td>
</tr>
<tr>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/enlaces.aspx'"
class="cabecera" id="id5" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/enlaces.gif'">ENLACES</a></td>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/contacto.aspx'"
class="cabecera" id="id6" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/contacto.gif'">CONTACTO</a></td>
</tr>
</table></div>
</td>
<td height="80" width="228" align=center>
<iframe src="signon/mini.aspx" scrolling="no" width="222" frameborder="0"
height="75" />
</td>
<td height="80" align="center" valign="middle">
<div align="center">
<p align="center"><b><font face="Verdana" size="2">ESPACIO RESERVADO PARA
NOTICIAS </font></b>
</div>
</td>
</tr>
</table>

</body>
 
T

ThatsIT.net.au

Francisco Ramos said:
Hello all

I'm getting a very strange behaviour with my <table> html elements when
designing my aspx.
See this screenshot:
http://personales.gestion.unican.es/ramosf/strangetables.jpg

This screen is formed by several frames. The top table has 2 rows, one
being
100% with (correct) and one row of four <td>, with the first three having
their width parameter fixed (to 80, 250 and 228 pixels). In Visual Studio
2005 I see it right, but when I run it locally, or publish to another
server,
it shows like in the screenshot.
The same happens more or less with the height of the bottom frame o_O

Here is the code of the top table, if it helps (only the design part, and
i've removed some javascripts)

Thanks a lot in advance

Francisco Ramos
Click to expand...


This is not a ASP problem.
you also have not explained what the strange behaviour is.
I can see your screen shot, but am not sure what you were aiming for
<html>
<!--
Estilos aplicados


-->
<head>
<meta http-equiv="Content-Language" content="es">
<title>cabecera</title>


</head>

<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0"
marginwidth="0" marginheight="0" style="text-align: center">

<table width="100%" id="table1" bgcolor="#195963" height="125">
<tr height="37">
<td height="37" colspan="4" bgcolor="#F2A910">
<p align="center">
<img border="0" src="images/cabecera.png" width="600" height="35"></td>
</tr>
<tr height="80px">
<td height="80" width="80" style="height: 80px">
<img border="0" name="imguc" src="images/logoweb.jpg" width="78"
height="78"></td>
<td height="80" width="250" align="center"><div align="center">
<table border="1" width="97%" id="table2" cellspacing="1" cellpadding="0"
height="76" bordercolor="#FFFFFF" style="border-collapse: collapse">
<tr>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='planes.aspx'"
class="cabecera" id="id1" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/libro.gif'">CURSOS
</a>
</td>
<td bgcolor="#195963" align="center"><b>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/presentacion.aspx'"
class="cabecera" id="id2" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/presen.gif'">PRESENTACION</a></b></td>
</tr>
<tr>
<td><b>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/ayuda.aspx'"
class="cabecera" id="id3" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/ayuda.gif'">AYUDA</a></b></td>
<td width="50%"><b>
<a href="http://www.cefont.unican.es" target="_top" class="cabecera"
id="id4" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/cefont_blancoverde.gif'">CeFoNT</a></b></td>
</tr>
<tr>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/enlaces.aspx'"
class="cabecera" id="id5" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/enlaces.gif'">ENLACES</a></td>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/contacto.aspx'"
class="cabecera" id="id6" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/contacto.gif'">CONTACTO</a></td>
</tr>
</table></div>
</td>
<td height="80" width="228" align=center>
<iframe src="signon/mini.aspx" scrolling="no" width="222" frameborder="0"
height="75" />
</td>
<td height="80" align="center" valign="middle">
<div align="center">
<p align="center"><b><font face="Verdana" size="2">ESPACIO RESERVADO PARA
NOTICIAS </font></b>
</div>
</td>
</tr>
</table>

</body>
Click to expand...
 
F

Francisco Ramos

What i was trying is this:
http://personales.gestion.unican.es/ramosf/strangetables2.jpg

(Note the differences in the <td> containing the university logo, now fixed
to 80x80 as intented, and the <iframe>s in the middle of the page, now
extended to 100% available space as intented)

wich I finally manage to get by changing the autogenerated doctype line:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

for this one:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

Thanks a lot for your interest anyway


ThatsIT.net.au said:
Francisco Ramos said:
Hello all

I'm getting a very strange behaviour with my <table> html elements when
designing my aspx.
See this screenshot:
http://personales.gestion.unican.es/ramosf/strangetables.jpg

This screen is formed by several frames. The top table has 2 rows, one
being
100% with (correct) and one row of four <td>, with the first three having
their width parameter fixed (to 80, 250 and 228 pixels). In Visual Studio
2005 I see it right, but when I run it locally, or publish to another
server,
it shows like in the screenshot.
The same happens more or less with the height of the bottom frame o_O

Here is the code of the top table, if it helps (only the design part, and
i've removed some javascripts)

Thanks a lot in advance

Francisco Ramos
Click to expand...


This is not a ASP problem.
you also have not explained what the strange behaviour is.
I can see your screen shot, but am not sure what you were aiming for
<html>
<!--
Estilos aplicados


-->
<head>
<meta http-equiv="Content-Language" content="es">
<title>cabecera</title>


</head>

<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0"
marginwidth="0" marginheight="0" style="text-align: center">

<table width="100%" id="table1" bgcolor="#195963" height="125">
<tr height="37">
<td height="37" colspan="4" bgcolor="#F2A910">
<p align="center">
<img border="0" src="images/cabecera.png" width="600" height="35"></td>
</tr>
<tr height="80px">
<td height="80" width="80" style="height: 80px">
<img border="0" name="imguc" src="images/logoweb.jpg" width="78"
height="78"></td>
<td height="80" width="250" align="center"><div align="center">
<table border="1" width="97%" id="table2" cellspacing="1" cellpadding="0"
height="76" bordercolor="#FFFFFF" style="border-collapse: collapse">
<tr>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='planes.aspx'"
class="cabecera" id="id1" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/libro.gif'">CURSOS
</a>
</td>
<td bgcolor="#195963" align="center"><b>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/presentacion.aspx'"
class="cabecera" id="id2" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/presen.gif'">PRESENTACION</a></b></td>
</tr>
<tr>
<td><b>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/ayuda.aspx'"
class="cabecera" id="id3" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/ayuda.gif'">AYUDA</a></b></td>
<td width="50%"><b>
<a href="http://www.cefont.unican.es" target="_top" class="cabecera"
id="id4" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/cefont_blancoverde.gif'">CeFoNT</a></b></td>
</tr>
<tr>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/enlaces.aspx'"
class="cabecera" id="id5" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/enlaces.gif'">ENLACES</a></td>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/contacto.aspx'"
class="cabecera" id="id6" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/contacto.gif'">CONTACTO</a></td>
</tr>
</table></div>
</td>
<td height="80" width="228" align=center>
<iframe src="signon/mini.aspx" scrolling="no" width="222" frameborder="0"
height="75" />
</td>
<td height="80" align="center" valign="middle">
<div align="center">
<p align="center"><b><font face="Verdana" size="2">ESPACIO RESERVADO PARA
NOTICIAS </font></b>
</div>
</td>
</tr>
</table>

</body>
Click to expand...
Click to expand...
 
T

ThatsIT.net.au

a better way to do this is like this

<table with="400" style="table-layout: fixed">

<col width="80" />

<col />

<col width="80" />

<tr>

<td>this will be 80</td>

<td>this will fill the rest of the table</td>

<td>this will be 80</td>

</tr>

</table>




Francisco Ramos said:
What i was trying is this:
http://personales.gestion.unican.es/ramosf/strangetables2.jpg

(Note the differences in the <td> containing the university logo, now
fixed
to 80x80 as intented, and the <iframe>s in the middle of the page, now
extended to 100% available space as intented)

wich I finally manage to get by changing the autogenerated doctype line:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

for this one:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

Thanks a lot for your interest anyway


ThatsIT.net.au said:
Francisco Ramos said:
Hello all

I'm getting a very strange behaviour with my <table> html elements when
designing my aspx.
See this screenshot:
http://personales.gestion.unican.es/ramosf/strangetables.jpg

This screen is formed by several frames. The top table has 2 rows, one
being
100% with (correct) and one row of four <td>, with the first three
having
their width parameter fixed (to 80, 250 and 228 pixels). In Visual
Studio
2005 I see it right, but when I run it locally, or publish to another
server,
it shows like in the screenshot.
The same happens more or less with the height of the bottom frame o_O

Here is the code of the top table, if it helps (only the design part,
and
i've removed some javascripts)

Thanks a lot in advance

Francisco Ramos
Click to expand...


This is not a ASP problem.
you also have not explained what the strange behaviour is.
I can see your screen shot, but am not sure what you were aiming for
<html>
<!--
Estilos aplicados


-->
<head>
<meta http-equiv="Content-Language" content="es">
<title>cabecera</title>


</head>

<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0"
marginwidth="0" marginheight="0" style="text-align: center">

<table width="100%" id="table1" bgcolor="#195963" height="125">
<tr height="37">
<td height="37" colspan="4" bgcolor="#F2A910">
<p align="center">
<img border="0" src="images/cabecera.png" width="600" height="35"></td>
</tr>
<tr height="80px">
<td height="80" width="80" style="height: 80px">
<img border="0" name="imguc" src="images/logoweb.jpg" width="78"
height="78"></td>
<td height="80" width="250" align="center"><div align="center">
<table border="1" width="97%" id="table2" cellspacing="1"
cellpadding="0"
height="76" bordercolor="#FFFFFF" style="border-collapse: collapse">
<tr>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='planes.aspx'"
class="cabecera" id="id1" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/libro.gif'">CURSOS
</a>
</td>
<td bgcolor="#195963" align="center"><b>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/presentacion.aspx'"
class="cabecera" id="id2" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/presen.gif'">PRESENTACION</a></b></td>
</tr>
<tr>
<td><b>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/ayuda.aspx'"
class="cabecera" id="id3" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/ayuda.gif'">AYUDA</a></b></td>
<td width="50%"><b>
<a href="http://www.cefont.unican.es" target="_top" class="cabecera"
id="id4" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/cefont_blancoverde.gif'">CeFoNT</a></b></td>
</tr>
<tr>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/enlaces.aspx'"
class="cabecera" id="id5" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/enlaces.gif'">ENLACES</a></td>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/contacto.aspx'"
class="cabecera" id="id6" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/contacto.gif'">CONTACTO</a></td>
</tr>
</table></div>
</td>
<td height="80" width="228" align=center>
<iframe src="signon/mini.aspx" scrolling="no" width="222"
frameborder="0"
height="75" />
</td>
<td height="80" align="center" valign="middle">
<div align="center">
<p align="center"><b><font face="Verdana" size="2">ESPACIO RESERVADO
PARA
NOTICIAS </font></b>
</div>
</td>
</tr>
</table>

</body>
Click to expand...
Click to expand...
Click to expand...
 
F

Francisco Ramos

Thanks a lot!!

ThatsIT.net.au said:
a better way to do this is like this

<table with="400" style="table-layout: fixed">

<col width="80" />

<col />

<col width="80" />

<tr>

<td>this will be 80</td>

<td>this will fill the rest of the table</td>

<td>this will be 80</td>

</tr>

</table>




Francisco Ramos said:
What i was trying is this:
http://personales.gestion.unican.es/ramosf/strangetables2.jpg

(Note the differences in the <td> containing the university logo, now
fixed
to 80x80 as intented, and the <iframe>s in the middle of the page, now
extended to 100% available space as intented)

wich I finally manage to get by changing the autogenerated doctype line:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

for this one:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

Thanks a lot for your interest anyway


ThatsIT.net.au said:
message Hello all

I'm getting a very strange behaviour with my <table> html elements when
designing my aspx.
See this screenshot:
http://personales.gestion.unican.es/ramosf/strangetables.jpg

This screen is formed by several frames. The top table has 2 rows, one
being
100% with (correct) and one row of four <td>, with the first three
having
their width parameter fixed (to 80, 250 and 228 pixels). In Visual
Studio
2005 I see it right, but when I run it locally, or publish to another
server,
it shows like in the screenshot.
The same happens more or less with the height of the bottom frame o_O

Here is the code of the top table, if it helps (only the design part,
and
i've removed some javascripts)

Thanks a lot in advance

Francisco Ramos


This is not a ASP problem.
you also have not explained what the strange behaviour is.
I can see your screen shot, but am not sure what you were aiming for







<html>
<!--
Estilos aplicados


-->
<head>
<meta http-equiv="Content-Language" content="es">
<title>cabecera</title>


</head>

<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0"
marginwidth="0" marginheight="0" style="text-align: center">

<table width="100%" id="table1" bgcolor="#195963" height="125">
<tr height="37">
<td height="37" colspan="4" bgcolor="#F2A910">
<p align="center">
<img border="0" src="images/cabecera.png" width="600" height="35"></td>
</tr>
<tr height="80px">
<td height="80" width="80" style="height: 80px">
<img border="0" name="imguc" src="images/logoweb.jpg" width="78"
height="78"></td>
<td height="80" width="250" align="center"><div align="center">
<table border="1" width="97%" id="table2" cellspacing="1"
cellpadding="0"
height="76" bordercolor="#FFFFFF" style="border-collapse: collapse">
<tr>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='planes.aspx'"
class="cabecera" id="id1" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/libro.gif'">CURSOS
</a>
</td>
<td bgcolor="#195963" align="center"><b>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/presentacion.aspx'"
class="cabecera" id="id2" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/presen.gif'">PRESENTACION</a></b></td>
</tr>
<tr>
<td><b>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/ayuda.aspx'"
class="cabecera" id="id3" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/ayuda.gif'">AYUDA</a></b></td>
<td width="50%"><b>
<a href="http://www.cefont.unican.es" target="_top" class="cabecera"
id="id4" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/cefont_blancoverde.gif'">CeFoNT</a></b></td>
</tr>
<tr>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/enlaces.aspx'"
class="cabecera" id="id5" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/enlaces.gif'">ENLACES</a></td>
<td>
<a href="#"
onclick="parent.frames['contenidos'].location.href='paginas/contacto.aspx'"
class="cabecera" id="id6" onmouseout="imguc.src='images/logoweb.jpg'"
onmouseover="imguc.src='images/contacto.gif'">CONTACTO</a></td>
</tr>
</table></div>
</td>
<td height="80" width="228" align=center>
<iframe src="signon/mini.aspx" scrolling="no" width="222"
frameborder="0"
height="75" />
</td>
<td height="80" align="center" valign="middle">
<div align="center">
<p align="center"><b><font face="Verdana" size="2">ESPACIO RESERVADO
PARA
NOTICIAS </font></b>
</div>
</td>
</tr>
</table>

</body>
Click to expand...
Click to expand...
Click to expand...
 
F

Francisco Ramos

Thanks, i posted here because i thought it had something to do with Visual
Studio. Now I know it was simply an html problem
 
B

Bob Barrows [MVP]

Francisco said:
Thanks, i posted here because i thought it had something to do with
Visual Studio. Now I know it was simply an html problem
Click to expand...

:)
This isn't a Visual Studio group either ... :)
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Uncaught ReferenceError: item is not defined at HTMLButtonElement.onclick in the: <button onclick="item.inserir()">Inserir dados</button> 1
Can someone tell me if this a real tracker? Or is it one designed to show you a different message at certain times, ie. acting like one? 0
Image shifts to the right when export the page to pdf 4
Sort by number of characters 1
Having trouble centering contents of td ? 3
I am using 2 loops, 1 for input and 1 for td. Can we achieve the same functionality with 1 loop in Jquery? 4
Help with Visual Lightbox: Scripts 2
Help with my responsive home page 2

Staff online

Members online

Total: 29 (members: 3, guests: 26)
Robots: 213

Forum statistics

Threads
473,764
Messages
2,569,566
Members
45,041
Latest member
RomeoFarnh

Latest Threads

Top