PDA

Click to See Complete Forum and Search --> : Please could someone help me with this table annoyance..?

Articuno
07-03-2006, 03:14 PM
Ok, this is starting to get on my nerves a lot now.. my tables are never at the very top of the page, there's always a little space before the table and it gets on my nerves.. I've seen people with their tables spot on at the top, I also know that you can align a table to the top but it is just not working for me! The body code starts off this way:

<table width="750" height="508" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<tr>
<td height="20" colspan="2"> <div align="center">

Now really.. what am I missing here..? Please PLEASE could someone help me out! I use dreamweaver and the option to set the table to the top just isn't there.. I tried coding that part myself and it still isn't right at the top.
the tree
07-03-2006, 03:24 PM
<style type="text/css">
body{
margin: 0;
padding: 0;
}
</style>What's wrong with tables for layout?
Why tables for layout is stupid (http://hotdesign.com/seybold/) Why avoiding tables (for layout) is important (http://davespicks.com/essays/notables.html) Tables or CSS: choosing a layout (http://evolt.org/article/Tables_or_CSS_Choosing_a_layout/25/21429/) Why go table free? (http://www.workingwith.me.uk/tablefree/why/) Tables vs. CSS: A fight to the death (http://www.sitepoint.com/article/tables-vs-css/) Why Tables Are Bad (For Layout) Compared to Semantic HTML + CSS (http://www.phrogz.net/CSS/WhyTablesAreBadForLayout.html) The layout is dead, long live the layout (http://www.westciv.com/style_master/house/good_oil/dead_layout/) How do you use CSS for layout then?
Practical CSS tips and tricks (http://alistapart.com/stories/practicalcss/) w3schools on CSS (http://w3schools.com/css/default.asp) CSS layouts by Glish (http://glish.com/css/) The Layout Reservoir (http://www.bluerobot.com/web/layouts/)
Articuno
07-03-2006, 03:26 PM
Thanks a lot, you're a star! I'll have to tone up on my skills before attempting anything other than table layouts and the links will really help me, so double thanks!! :cool:
humbug
07-04-2006, 09:36 AM
Remember, too, that if you do:

<td>
table content
</td>

there will be a leading and trailing space round " table content ".

To make sure you don't get any spaces, follow the <body> tag with the
<table> tag without any newline or space. Make your newlines inside tags to avoid the space being included in content.

e.g.
<img src = "addr"
align=right>
the tree
07-04-2006, 10:16 AM
humbug, you do know that in all browsers, whitespace is completely ignored right?
humbug
07-04-2006, 10:27 AM
Wrong. Whitespace of whatever length is rendered into one space.

So, to take a simple example, if you have a table in which you want to split an image, but make it look as if it's all one image, you might do:

<table border=0 cellpadding=0>
<tr>
<td>
<img src="lefthandsideofimage.jpg" border=0>
</td>
<td>
<img src="righthandsideofimage.jpg" border=0>
</td>
</tr>
</table>

and you would discover that the two halves of the image would be separated by a couple of spaces.

To eliminate them, you have to do:
<table border=0 cellpadding=0>
<tr><td><img src="lefthandsideofimage.jpg" border=0></td>
<td><img src="righthandsideofimage.jpg" border=0></td>
</tr>
</table>

or even:
<table border=0 cellpadding=0><tr><td><img
src="lefthandsideofimage.jpg" border=0></td><td><img
src="righthandsideofimage.jpg" border=0></td></tr></table>

Then you are absolutely sure there are no spare spaces kicking around inside the table.
the tree
07-04-2006, 11:03 AM
Whitespace is completely ignored, a line break after but on the same line as PC-data isn't.

If you code a table in compliance with modern standards, you wont run across this issue.
table{
border-collapse: collapse;
}
tr,td{
margin: 0;
padding: 0;
border: none;
}
<table>
<tbody>
<tr>
<td>
<img src="lefthandsideofimage.jpg" alt="">
</td>
<td>
<img src="righthandsideofimage.jpg" alt="">
</td>
</tr>
</tbody>
</table>
humbug
07-04-2006, 11:13 AM
OK, but I'll not take your word for it till I try!
Charles
07-04-2006, 12:10 PM
OK, but I'll not take your word for it till I try!From the HTML 4.01 Specification
SGML (see , section 7.6.1) specifies that a line break immediately following a start tag must be ignored, as must a line break immediately before an end tag. This applies to all HTML elements without exception.
[i] http://www.w3.org/TR/REC-html40/appendix/notes.html#notes-line-breaks ..
felgall
07-04-2006, 03:29 PM
specifies that a line break immediately following a start tag must be ignored, as must a line break immediately before an end tag

Pity that not all browsers abide by this rule though - guess which one doesn't.
humbug
07-06-2006, 11:05 AM
Yes, I now see that most of the modern browsers do adhere to the whitespace business. Perhaps the clue is that I started coding HTML in 1997 and have developed a very defensive style.

To check it out, I have put up a web page HERE (http://www.amazonsystems.co.uk/ice/example.htm),
showing the code used for each picture.

Two of the older browsers failed on the indented tidy example.