Forum Moderators: open

Message Too Old, No Replies

Table arrangement problems

         

sai digitalle

5:51 pm on Nov 4, 2004 (gmt 0)

10+ Year Member



I'm using dreamweaver mx 2004, and when i preview the page in a the browser, i notice a slight gap where to rows should meet. Any suggestions or explainations anyone?

Thanks for your help folks,
Sai_digitalle

BlobFisk

5:55 pm on Nov 4, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hi sai_digitalle,

Maybe if you could post a short snippet of the code around the area of these two rows we may be able to figure out the problem!

Have you tried validating [validator.w3.org] your page? This can catch any little error that may be the cause of this. Also, on IE line breaks can sometimes cause white space on pixel perfect layouts - another one to watch.

HTH

encyclo

6:05 pm on Nov 4, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Also, make sure you have completely removed the cellspacing and cellpadding for all the tables:

<table cellpadding="0" cellspacing="0">

sai digitalle

11:23 pm on Nov 4, 2004 (gmt 0)

10+ Year Member



What's up fellas. I'm getting 13 friggin' errors man! OH! And thanks for telling me about Validator, it's an awesome resource.

my first error and the error explaination:
Line 39, column 155: there is no attribute "ALLOWTRANSPARENCY"

...0" marginwidth="0" allowtransparency="true" width="576"></IFRAME>

"You have used the attribute named above in your document, but the document type you are using does not support that attribute for this element. This error is often caused by incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Transitional" document type to get the "target" attribute), or by using vendor proprietary extensions such as "marginheight" (this is usually fixed by using CSS to achieve the desired effect instead).
This error may also result if the element itself is not supported in the document type you are using, as an undefined element will have no supported attributes; in this case, see the element-undefined error message for further information."
"How to fix: check the spelling and case of the element and attribute, (Remember XHTML is all lower-case) and/or check that they are both allowed in the chosen document type, and/or use CSS instead of this attribute."

My 2nd on down to the 13th is the same error. which i find odd because Dreamweaver wrote the code when i drew out the hotspots. So how is this an error if the program itself generated it? Here's the error:

Line 60, column 86: required attribute "ALT" not specified

...weddings/weddings.swf" target="flash">

"The attribute given above is required for an element that you've used, but you have omitted it. For instance, in most HTML and XHTML document types the "type" attribute is required on the "script" element and the "alt" attribute is required for the "img" element."

and this same error is listed for error #3 to the last one.

sai digitalle

11:33 pm on Nov 4, 2004 (gmt 0)

10+ Year Member



Here's my full code:

<body>
<table width="980" border="0" align="center" cellpadding="0" cellspacing="0">
<!-- fwtable fwsrc="980.png" fwbase="index.jpg" fwstyle="Dreamweaver" fwdocid = "1339021709" fwnested="0" -->
<tr>
<td><img src="spacer.gif" width="5" height="1" border="0" alt=""></td>
<td><img src="spacer.gif" width="195" height="1" border="0" alt=""></td>
<td><img src="spacer.gif" width="579" height="1" border="0" alt=""></td>
<td><img src="spacer.gif" width="196" height="1" border="0" alt=""></td>
<td><img src="spacer.gif" width="5" height="1" border="0" alt=""></td>
<td><img src="spacer.gif" width="1" height="1" border="0" alt=""></td>
</tr>

<tr>
<td colspan="5"><img name="index_r1_c1" src="index_r1_c1.jpg" width="980" height="120" border="0" alt=""></td>
<td><img src="spacer.gif" width="1" height="120" border="0" alt=""></td>
</tr>
<tr>
<td rowspan="2" colspan="2"><img src="index_r2_c1.jpg" alt="" name="index_r2_c1" width="200" height="441" border="0" usemap="#index_r2_c1Map"></td>
<td valign="top" bgcolor="#393D49"><div align="center">
<IFRAME name="target" src="welcome.htm" height=432 scrolling="no" frameborder=0 align="middle" marginheight="0" marginwidth="0" allowtransparency="true" width="576"></IFRAME>
</div></td>
<td rowspan="2" colspan="2"><img name="index_r2_c4" src="index_r2_c4.jpg" width="201" height="441" border="0" alt=""></td>
<td><img src="spacer.gif" width="1" height="431" border="0" alt=""></td>
</tr>
<tr>
<td><img name="index_r3_c3" src="index_r3_c3.jpg" width="579" height="10" border="0" alt=""></td>
<td><img src="spacer.gif" width="1" height="10" border="0" alt=""></td>
</tr>
<tr>
<td rowspan="2"><img name="index_r4_c1" src="index_r4_c1.jpg" width="5" height="239" border="0" alt=""></td>
<td height="120" colspan="3" bgcolor="#393D49"><iframe name="flash" src="container.asp" height=120 scrolling = no width =966 frameborder=0></iframe></td>
<td rowspan="2"><img name="index_r4_c5" src="index_r4_c5.jpg" width="5" height="239" border="0" alt=""></td>
<td><img src="spacer.gif" width="1" height="144" border="0" alt=""></td>
</tr>
<tr>
<td colspan="3"><img src="index_r5_c2.jpg" alt="" name="index_r5_c2" width="970" height="95" border="0" usemap="#index_r5_c2Map"></td>
<td><img src="spacer.gif" width="1" height="95" border="0" alt=""></td>
</tr>
</table>
<map name="index_r2_c1Map">
<area shape="rect" coords="4,36,194,110" href="weddings/weddings.swf" target="flash">
<area shape="rect" coords="4,111,193,183" href="portraits/portraits.swf" target="flash">
<area shape="rect" coords="4,186,195,257" href="bridal/bridal.swf" target="flash">
<area shape="rect" coords="4,259,194,330" href="commercial/commercial.swf" target="flash">
<area shape="rect" coords="3,333,194,408" href="specialevents/specialevents.swf" target="flash">
</map>
<map name="index_r5_c2Map">
<area shape="rect" coords="250,18,337,51" href="http://www.example1.com" target="_blank"/>
<area shape="rect" coords="340,19,470,51" href="http://www.example2.com" target="_blank">
<area shape="rect" coords="473,19,597,51" href="http://www.example3.com" target="_blank">
<area shape="rect" coords="599,19,721,51" href="http://www.example4.com" target="_blank">
<area shape="rect" coords="724,18,861,51" href="http://www.example5.com" target="_blank">
<area shape="rect" coords="864,19,964,51" href="http://www.example6.com" target="_blank">
</map>
</body>
</html>

[edited by: tedster at 12:05 am (utc) on Nov. 5, 2004]

encyclo

12:20 am on Nov 5, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



sai digitalle, if the 13 errors are all either an unrecognized attribute or a missing
alt
attribute, then it's not that which is cousing the problem.

To fix most of those errors anyway, if you see the 11 lines which all look something like:

<area shape="rect" coords="4,36,194,110" href="weddings/weddings.swf" target="flash">

You just need to add the

alt
attribute:

<area shape="rect" coords="4,36,194,110" href="weddings/weddings.swf" [b]alt=""[/b] target="flash">

Are you still getting the gap? Is it between two particular rows, or all of them?

sai digitalle

12:55 am on Nov 5, 2004 (gmt 0)

10+ Year Member



o ok cool thanks. Yes i am still getting the gaps. it's between two rows. It's weird though. I know i can't post my site url here, but how would i go about letting you see it so you can judge it for yourself? Do you have messenger?

BonRouge

1:00 am on Nov 5, 2004 (gmt 0)

10+ Year Member



Did you try
<style type="text/css">
table {
border-collapse:collapse;
}
</style>

?
(in your head)

Send me a message with your URL - I'd like to try to figure it out.

[edited by: BonRouge at 1:06 am (utc) on Nov. 5, 2004]

sai digitalle

1:06 am on Nov 5, 2004 (gmt 0)

10+ Year Member



Thanks for the advice Bon. I just tried it and it did'nt work. i'm begining to wonder if this had anything to do with they way I created it in photoshop? have you all ever encountered any spacing problems as a result of design methods used?

tedster

1:07 am on Nov 5, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Can you show us, in the HTML, where the gaps occur - between which rows? Also what DTD are you using and what browser/version.

sai digitalle

1:20 am on Nov 5, 2004 (gmt 0)

10+ Year Member



thanks for having patience with me fellas, and in case you haven't noticed, i'mma NOOB. What is 'DTD'? Here's what i'm using, Dreamweaver MX 2004, Mac OSX, Safari browser. here's are the two rows where the gap is occurring and the design ofcourse is identical on both sides. I hope this sheds some light.

<tr>
<td rowspan="2" colspan="2"><img src="index_r2_c1.jpg" alt="" name="index_r2_c1" width="200" height="441" border="0" usemap="#index_r2_c1Map"></td>
<td valign="top" bgcolor="#393D49"><div align="center">
<IFRAME name="target" src="welcome.htm" height=432 scrolling="no" frameborder=0 align="middle" marginheight="0" marginwidth="0" allowtransparency="true" width="576"></IFRAME>
</div></td>
<td rowspan="2" colspan="2"><img name="index_r2_c4" src="index_r2_c4.jpg" width="201" height="441" border="0" alt=""></td>
<td><img src="spacer.gif" width="1" height="431" border="0" alt=""></td>
</tr>

AND THE ROW BELOW IT:
<tr>
<td rowspan="2"><img name="index_r4_c1" src="index_r4_c1.jpg" width="5" height="239" border="0" alt=""></td>
<td height="120" colspan="3" bgcolor="#393D49"><iframe name="flash" src="container.asp" height=120 scrolling = no width =966 frameborder=0></iframe></td>
<td rowspan="2"><img name="index_r4_c5" src="index_r4_c5.jpg" width="5" height="239" border="0" alt=""></td>
<td><img src="spacer.gif" width="1" height="144" border="0" alt=""></td>
</tr>

encyclo

1:26 am on Nov 5, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



For the DTD, at the very top of the markup, you should see something like this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>

What does your's look like? Or does it simply start with

<html>
?

sai digitalle

1:33 am on Nov 5, 2004 (gmt 0)

10+ Year Member



o ok! It's pretty long and takes up two lines, here it is. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

encyclo

1:57 am on Nov 5, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



If you remove the entire doctype (temporarily - we'll have to put it back later) does the layout of the page change at all?

sai digitalle

1:59 am on Nov 5, 2004 (gmt 0)

10+ Year Member



No Sir.... wooooooow what have done to my paaaaaaage!

encyclo

2:03 am on Nov 5, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



If it messes with the page and the gap doesn't disappear, put it back as it was!

sai digitalle

2:11 am on Nov 5, 2004 (gmt 0)

10+ Year Member



it did'nt work...dang it!

tedster

3:36 am on Nov 5, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Now I've got an idea - you'll need to do a little study, but I think you have a standards mode vs quirks mode issue.

Check here:
[webmasterworld.com...]

sai digitalle

3:37 am on Nov 5, 2004 (gmt 0)

10+ Year Member



YO! i got the answer. the IFRAME was 1pixel too tall! Thanks fellas and thanks to Bon for the answer!