Help me in table & frame coding

movwills · Aug 20, 2011

Hello friends!

Pls help me in this coding...

<html>
<head>
<title>Using rows and cols span</title>
<body>
<table border=1 rule=all>
<tr>
<td rowspan=2 colspan=3>first cell</td>
<td colspan=2> second cell</td>
</tr>
<tr>
<td>third cell</td>
<td>fourth cell</td>
</tr>
<tr>
<td colspan=2> fifth cell</td>
<td colspan=3> Sixth cell</td>
</tr>
</table>
</body>
</html>

This shows me in this style
http://i56.tinypic.com/316xl6v.jpg

What is wrong here?

PC-XT · Aug 21, 2011

That looks right. How do you want it to look?

If you want the cells to be the same width and height, you can give them width and height attributes, or better, use CSS. (The attributes only give suggested values, which the browser adjusts to fit the window as it sees fit, while CSS is followed more strictly.)

You could try giving each cell a width=20% attribute, multiplying it by the colspan, so for the colspan=2 td use width=40%, or 60% for colspan=3. If you don't want it to fill the window, give it a number without a percent sign to be the number of pixels inside the cell.

mary7 · Sep 6, 2011

Hello movwills, you should use quotes after all = sign and after 1 the same as i have below
I am learning html & css now for a while as i want to learn web design

If you want you could change it around like this;

<html>
<head>
<title>Using rows and cols span</title>
<body>
<table border="1" rule="all">
<tr>
<td rowspan="2">first cell</td>
<td>second cell</td>
</tr>
<tr>
<td>third cell</td>
</tr>
<tr>
<td rowspan="2">fourth cell</td>
<td> fifth cell</td>
</tr>
<tr>
<td> Sixth cell</td>
</tr>
</table>
</body>
</html>

Or like this;

<html>
<head>
<title>Using rows and cols span</title>
<body>
<table border="1" rule="all">
<tr>
<td colspan="3">first cell</td>
</tr>
<tr>
<td>second cell</td>
<td>forth cell</td>
</tr>
<tr>
<td>third cell</td>
<td>fifth cell</td>
</tr>
</table>
</body>
</html>

mjnc · Sep 7, 2011

There is a mismatch with your colspan totals and the actual number of columns in the table.
I came up with an alternate version so you can see the difference.
I can not get the text to center in the expanded width columns in Internet Explorer (IE) less than version 8 in Standards mode.
Won't even work in IE8 compatibility mode.
The only solution, so far, would be to apply a class style to those cells or use an inline style.
It works fine in K-Meleon and Opera.
Still looking for a CSS centering solution for the colspan columns in IE < 8.

Had the code nicely formatted, but all the blank spaces get pulled out.

http://www.activejump.com/j-6.shtml

http://www.idocs.com/tags/tables/index_famsupp_30.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">


<html lang="en">
<head>
<title>Using rows and cols span</title>
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">

body {
text-align: center; /* makes table center in IE with margin auto */
}

table {
margin: 2em auto 2em auto;
width: 20em;
}
table tr {
width: 100%;
}

table td {
/* width: 8em !important; */
width: 100%;
padding: 5px;
text-align: center; /* does Not work in expanded columns in IE less than ver 8 Standards mode !! */
}

</style>

</head>
<body>

<table border=1 rule=all>
<tr>

<td rowspan="2" colspan="3">first cell</td>
<td colspan="2"> second cell</td>
</tr>
<tr>

<td>third cell</td>
<td>fourth cell</td>
</tr>
<tr>

<td colspan="2"> fifth cell</td>
<td colspan="3"> Sixth cell</td>
</tr>
</table>

<table border=1 rule=all>
<tr>
<td rowspan="2" colspan="1">first cell</td>
<td colspan="1">second cell</td>
</tr>
<tr>
<td>third cell</td>
</tr>
<tr>
<td colspan="2">fourth cell</td>
</tr>
<tr>
<td>Sixth cell</td>
<td>Seventh cell</td>
</tr>
</table>

</body>
</html>

mjnc · Sep 7, 2011

Found a solution for the centering problem.

The following CSS is much simpler and it works in IE, except that the tables are not centered on the page in IE 6,
although there are solutions for that.

Sorry for the confusion. :-o
Hope this helps.

body {
text-align: center;
}
table {
margin: 2em auto 2em auto;
width: 20em;
}
table td {
padding: 5px;
text-align: center;
}

Log in or Sign up

Help me in table & frame coding

movwills Private E-2

PC-XT Master Sergeant

mary7 Private E-2

mjnc MajorGeek

mjnc MajorGeek