Hi! I'm new to the forum. I just found it while searching for html help, and it helped me with several things. I have a new problem that I need help with now.
I am a relatively novice web programmer. I am working on a website for my school's Frisbee team and I have encountered some problems with a table I'm using. I made the table, sliced it up in photoshop, and now when I try to put it into table form, it puts an unnecessary space between the first and second row, but not the second and third. I need to figure out how to eliminate this space. I have set the cellspacing and cellpadding to zero, but it is still there. If any of you could give me a hand with this, it would be greatly appreciated. Code is below. Thanks in advance!

PS: This is just the template I will be using for each page, and none of the links work yet. I'm waiting to get the template ready before I buy a domain.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>Westside Warmachine Ultimate</title>
    <meta name="keywords" content="Frisbee, Ultimate, Ultimate Frisbee, Westside, Warmachine, Disc" />
    <meta name="description" content="Westside High School Ultimate Frisbee Team" />
    <style type="text/css">
        <!--
            html,body,table#pagelayout {
            height:100%;
            width:777px;
            margin:auto;
        }

        // -->
    </style>
</head>
<body bgcolor="#737373">
<center>
    <img src="http://i383.photobucket.com/albums/oo276/warmachine_disc/logo.png" alt="Logo">
    <img src="http://i383.photobucket.com/albums/oo276/warmachine_disc/seperated_button_barcopy.png" alt="Buttons" usemap="#buttons" border="0">
    <map name="buttons">
        <area shape="rect" coords="45,9,146,45" href="testing.com">
        <area shape="rect" coords="191,9,292,45" href="testing.com">
        <area shape="rect" coords="338,9,439,45" href="testing.com">
        <area shape="rect" coords="484,9,585,45" href="testing.com">
        <area shape="rect" coords="630,9,731,45" href="testing.com">
    </map>
    <table id="pagelayout" cellspacing="0" cellpadding="0" border="0">
        <tr style="height:17px;">
            <td style="width:17px;"><img src="http://i383.photobucket.com/albums/oo276/warmachine_disc/tr_corner_01.png"></td>
            <td style="width:740px;"><img src="http://i383.photobucket.com/albums/oo276/warmachine_disc/t_bar.png"></td>
            <td style="width:20px;"><img src="http://i383.photobucket.com/albums/oo276/warmachine_disc/tr_corner_03.png"></td>
        </tr>
        <tr style="height:100%;">
            <td style="width:17px;"><img src="http://i383.photobucket.com/albums/oo276/warmachine_disc/b_bar_04.png" height="100%" width="17"> </td>
            <td style="width:740px;" bgcolor="#A1A1A1"> TESTING 1 2 3 </td>
            <td style="width:20px;"><img src="http://i383.photobucket.com/albums/oo276/warmachine_disc/table_06.png" height="100%" width="20"> </td>
        </tr>
        <tr style="height:22px;">
            <td style="width:17px;"><img src="http://i383.photobucket.com/albums/oo276/warmachine_disc/b_bar_07.png"> </td>
            <td style="width:740px;"><img src="http://i383.photobucket.com/albums/oo276/warmachine_disc/b_bar_08.png"> </td>
            <td style="width:20px;"><img src="http://i383.photobucket.com/albums/oo276/warmachine_disc/br_corner_09.png"> </td>
        </tr>
    </table>
</center>

</body>
</html>

Recommended Answers

All 5 Replies

hello...
i just tried your code in another way...
it doesn't give any spaces...
have a look at it..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body   bgcolor="#737373" >
<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td  align="center" valign="middle"><img src="images/corner_left_top.png" width="17" height="17"  /></td>
    <td width="100%" ><img src="images/middle1.png"  width="1000" height="17" /></td>
    <td  ><img src="images/corner_right_top.png" width="20" height="17" /></td>
  </tr>
  <tr>
    <td ><img src="images/left.png" width="17" height="261"  /></td>
    <td  bgcolor="#A1A1A1">&nbsp;</td>
    <td><img src="images/right.png" width="20" height="261"   /></td>
  </tr>
  <tr>
    <td><img src="images/corner_left_bottom.png" width="17" height="22" /></td>
    <td><img src="images/middle2.png"  width="1000" height="22"/></td>
    <td><img src="images/corner_right_bottom.png" width="20" height="22" /></td>
  </tr>
</table>
</body>
</html>

Thanks! Both these solutions worked! I appreciate the help.
Now, however, I have another question. What process do you use for trying to solve these problems? Do you pick a specific place to start in the code, or do you just start at the top and work your way down? Although I'm sure I could get any help I needed from the forum, it would be a lot easier if I could do it myself
Thanks in advance

i just started redesign with new tables in my dreamweaver...i got correct output...then i was thinking , why your design didn't get good output, then after some time ,i was seeing the changes of your code with my code, then i found the first line is the reason, i just replace that with my line, then its working perfectly...

i think our dreamweaver supports the XHTML....

Its pretty much a personal preference, however, best thing to do would be start at the top :) Open another editor (i.e. notepad 2, notepad++, etc.) and copy and paste one section (whatever is not doing what you want to) and work on it from there.

I would get the declaration, header, and whatever isn't doing what I want, as well as any CSS/layout coding. Then I would start changing things until they work the way I want to :) But with something like only one table like this its a little easier than a couple hundred line code with javascript thrown in :)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.