removing space between tables

S

Sharon Lee

I have been unable to remove a space between tables

You can see it here:

http://www.wodong.com/sharon/test1.htm

the space between the ad and the next row.

They are separate tables now but they were the same table different
rows but same problem.

I have tried 'padding-bottom: 0;' and 'margin-bottom: 0' styled on
the row and the cell when they were part of one table but no change.

If I load the code in front page there is no space.

I actually code in php so it is not a front page issue, you can see
the same php version here:

http://www.wodong.com/sharon/test1.php

I have removed all the style now so I can step through any
suggestions.

This is one of two problems I have with html formatting contrary to
instructions, but the solution to this might solve the other one.

Thanks for your suggestions.
 
R

Richard

Sharon said:
I have been unable to remove a space between tables
You can see it here:

the space between the ad and the next row.
They are separate tables now but they were the same table different
rows but same problem.
I have tried 'padding-bottom: 0;' and 'margin-bottom: 0' styled on
the row and the cell when they were part of one table but no change.
If I load the code in front page there is no space.
I actually code in php so it is not a front page issue, you can see
the same php version here:

I have removed all the style now so I can step through any
suggestions.
This is one of two problems I have with html formatting contrary to
instructions, but the solution to this might solve the other one.
Thanks for your suggestions.


<table border="0" cellpadding="0" cellspacing="0" width="100%"
bgcolor="#DDDDDD">
<tr>
<td width="25%" </td>

<td width="75%" align="center" valign="bottom">
<img border="0" src="banner.gif">
</td>
</tr>
</table>


One possibility is the fact you forgot a closing >.
Then try aslo <img src = ""></td> all one line.


But if you learned to use a simple division, you'd have less coding to work
with.

div.leftheader { width:25%; background:#DDDDDD; float:left; }
div.rightheader {width:75%; background:#DDDDDD; }


<body>
<div class="leftheader">content here</div>
<div class="rightheader"><img src=""></div>
</body>

Between "page name" could be a simple graphic or even <hr>.
 
S

Sharon Lee

i cant see a reason to use tables on that page and the markup is invalid
anyway. you cant just throw any shit together and expect it to do what
you want.

There is no need to use that sort of language.

You are not talking to your mother or your wife.
</table><table...>

from http://www.w3.org/TR/REC-html40/struct/tables.html

******************************************************************************
Here's a simple table that illustrates some of the features of the
HTML table model. The following table definition:

<TABLE border="1"
summary="This table gives some statistics about fruit
flies: average height and weight, and percentage
with red eyes (for both males and females).">
<CAPTION><EM>A test table with merged cells</EM></CAPTION>
<TR><TH rowspan="2"><TH colspan="2">Average
<TH rowspan="2">Red<BR>eyes
<TR><TH>height<TH>weight
<TR><TH>Males<TD>1.9<TD>0.003<TD>40%
<TR><TH>Females<TD>1.7<TD>0.002<TD>43%
</TABLE>
**************************************************************************
looks like </table> closes the table to me .. and opening another
table would be <table>

.... and this is really a great help:
i cant see a reason to use tables on that page

what would you use ? colored pencils?
 
B

brucie

There is no need to use that sort of language.

heres some more: poo, bum and weewee.
looks like </table> closes the table to me .. and opening another
table would be <table>

gee you're clever

<quote>
I have been unable to remove a space between tables
</quote>

lets pretend that your markup is valid and the space between the tables
still exists. using </table><table...> may solve the problem as the line
break has been removed.

</table> being the closing tag of the first table and <table> being the
opening tag of the second.

is that simple enough for you?
what would you use ?

a pointy stick
colored pencils?

shinny little pebbles

anyone know when skool goes back?
 
R

Richard

brucie said:
in post <Sharon Lee said:
heres some more: poo, bum and weewee.
gee you're clever
<quote>
I have been unable to remove a space between tables
</quote>
lets pretend that your markup is valid and the space between the tables
still exists. using </table><table...> may solve the problem as the line
break has been removed.
</table> being the closing tag of the first table and <table> being the
opening tag of the second.
is that simple enough for you?
a pointy stick
shinny little pebbles
anyone know when skool goes back?


Oh boy genius, that space between the tables is for the borders.
And you are always so polite when people ask about tables.
Just what makes you the absolute expert on html anyways?
 
L

Lauri Raittila

In said:
There is no need to use that sort of language.

No, but in doesn't hurt him, as he knows everything.
Most invalid bit in your thing is: said:
You are not talking to your mother or your wife.

He talks that way to everybody.

You forgot to quote this bit: "Tables should not be used purely as a
means to layout document content"
looks like </table> closes the table to me .. and opening another
table would be <table>

And when you have 2 linebreaks between them, the whitespace bug may aply
in your browser. I don't know which browser you use (no problems with
O7.5p1), but I guess brucies tip to remove whitespace between tags could
work. I can't see any gap first place.
... and this is really a great help:

Me neither.
what would you use ? colored pencils?

Correct markup, and CSS for styling. Something like this maybe:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<title>Test</title>
<style type="text/css">
div { border-left:25% solid #DDDDDD;
background:#DDDDDD;
text-align:center;
height:60px
}
h1 { margin-top:0;
border:solid green;
border-width:10px 0 10px 0;
font-weight:bold;
text-align:center;
}
</style>
<div><img src="banner.gif" alt=""></div>
<h1>PAGE NAME</h1>
 
D

David Graham

Lauri said:
No, but in doesn't hurt him, as he knows everything.


He talks that way to everybody.


You forgot to quote this bit: "Tables should not be used purely as a
means to layout document content"


And when you have 2 linebreaks between them, the whitespace bug may aply
in your browser. I don't know which browser you use (no problems with
O7.5p1), but I guess brucies tip to remove whitespace between tags could
work. I can't see any gap first place.


Me neither.


Correct markup, and CSS for styling. Something like this maybe:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<title>Test</title>
<style type="text/css">
div { border-left:25% solid #DDDDDD;
background:#DDDDDD;
text-align:center;
height:60px
}
h1 { margin-top:0;
border:solid green;
border-width:10px 0 10px 0;
font-weight:bold;
text-align:center;
}
</style>
<div><img src="banner.gif" alt=""></div>
<h1>PAGE NAME</h1>

Hi
Only Opera 7.23 would take the percentage for the border width, nothing
shows in IE6 or Mozilla 1.4 (I made the border red so I could see it)
Opera center aligns the banner in space left after border 25% is subtracted
from browser width, so the banner ends up looking off center to the right.
Is a percentage an allowed unit for the width of a border? and why did you
use a border in this example - there does not seem to be any purpose for it,
especially as you have it in an identical colour to the background so that
it is invisible.
David
 
S

Sharon Lee

Thank you for your patience and help Lauri.

The code that was at the URL I pointed to was a little bit messy
because I was very tired after working on it for many hours trying
different types of style elements and in the end left a closing
bracket out.

I have never used DIV tag before. I did not know it was important to
use DIV tag for layout. I thought using tables was a standard for
layout. I have already written a couple of webpages just using table
layout.

'SAMS teach yourself web publishing with HTML4' briefly mentions DIV
on only one page in relation to alignment but does not mention its
importance in layout.

'HTML for Dummies' does not mention the DIV tag at all (as far as I
could see in the index and the contents)

I am therefore very grateful that you have brought to my attention the
importance and power of the DIV tag in layout.

I tried the code you posted and of course it works.

My actual code is more complicated that what I posted with contents in
the other cells. I will learn some more from the net and experiment
with embedded DIV tags or tables inside DIV.

I also have another format problem that this will probably solve as
well. I just woke up a while ago so I haven't had time to apply it but
I wanted to say thanks now.

I am always very grateful for the help I recieve and attempt to repay
it by helping others when I am in a position to do so.

Thank you once again.
 
S

Sharon Lee

<table border="0" cellpadding="0" cellspacing="0" width="100%"
bgcolor="#DDDDDD">
<tr>
<td width="25%" </td>

<td width="75%" align="center" valign="bottom">
<img border="0" src="banner.gif">
</td>
</tr>
</table>


One possibility is the fact you forgot a closing >.
Then try aslo <img src = ""></td> all one line.


But if you learned to use a simple division, you'd have less coding to work
with.

div.leftheader { width:25%; background:#DDDDDD; float:left; }
div.rightheader {width:75%; background:#DDDDDD; }


<body>
<div class="leftheader">content here</div>
<div class="rightheader"><img src=""></div>
</body>

Between "page name" could be a simple graphic or even <hr>.

Thank you Richard, you are right, I do not know how to use the DIV
tag. So I am glad I asked the question and learnt about its
importance, although disappointed that I have already spent so much
time writing web pages without using it.
 
S

Sharon Lee

Standard problem, solved here each week.

Bad:
<img ...>
</td>

Good:
<img ...></td>

Why are you using a table simply to position an image? You can apply some
CSS directly to the image.

Cheers
Richard.

Thanks Richard, there is content in the first cell of the table of the
actual code. I might learn how to use the DIV tag properly to develop
a solution.
 
K

kayodeok

(e-mail address removed) (Sharon Lee) wrote in
'SAMS teach yourself web publishing with HTML4' briefly mentions
DIV on only one page in relation to alignment but does not
mention its importance in layout.

'HTML for Dummies' does not mention the DIV tag at all (as far
as I could see in the index and the contents)

I once browsed 'HTML for Dummies' in a bookstore, I can't recall what
caught my eye at the time, but it was enough not to recommend it to
anybody.

I usually recommend 'HTML for the World Wide Web' 5th Edition by
Elizabeth Castro.

I can't speak for the american market, but it is cheaper than 'HTML
for dummies' (At Amazon.co.uk anyway)
 
L

Lauri Raittila

Gee, it doesn't say that CSS should be correct, right? ;-)
Hi
Only Opera 7.23 would take the percentage for the border width, nothing
shows in IE6 or Mozilla 1.4

Very much possible, as percentages sure aren't allowed. Should have of
course checked, but it was 5am and my brains were nearing sleep
already...
(I made the border red so I could see it)
Opera center aligns the banner in space left after border 25% is subtracted
from browser width, so the banner ends up looking off center to the right.

That was case with orginal too. Padding would have done the same thing,
so I don't understand why I used border.
Is a percentage an allowed unit for the width of a border?
No.

and why did you
use a border in this example - there does not seem to be any purpose for it,
especially as you have it in an identical colour to the background so that
it is invisible.

To position ad center of remainig 75%, as it was done in orginal. I have
no idea why one would like to do that.
 
L

Lauri Raittila

In said:
Thank you for your patience and help Lauri.

The code that was at the URL I pointed to was a little bit messy
because I was very tired after working on it for many hours trying
different types of style elements and in the end left a closing
bracket out.

Thats why you should find errors using tools like validator or CSS-
checker. Makes it lots easier.

Validator:
http://www.htmlhelp.com/tools/validator/
CSS checker:
http://jigsaw.w3.org/css-validator/

About all you need to know about validation:
http://www.cs.tut.fi/~jkorpela/html/validation.html
I have never used DIV tag before. I did not know it was important to
use DIV tag for layout.

It is not important to use div tag for layout. It is important to not use
any markup for wrong purpose. As div element don't have any meaning but
grouping, it can be used as generic layout element, when there is no
semantically better element in html.
I thought using tables was a standard for layout. I have already
written a couple of webpages just using table layout.

Yes, that is the problem. It used to be only way to do any fancy layouts
about 5 years back, and now there is too many 'experinced' HTML 'gurus'
that don't know basics of html, and spread misinformation.
'SAMS teach yourself web publishing with HTML4' briefly mentions DIV
on only one page in relation to alignment but does not mention its
importance in layout.

I have never seen any good HTML book since tables were introduced. Before
that it was impossible to use them incorrectly ;-)

Nowadays there is at least some. (I know whitout seeing that Korpela's
book can't be all bad, but it is only available in Finnish, I think.)
'HTML for Dummies' does not mention the DIV tag at all (as far as I
could see in the index and the contents)

That is mistitled book, it should be "HTML by Dummies".
I am therefore very grateful that you have brought to my attention the
importance and power of the DIV tag in layout.

I tried the code you posted and of course it works.

Notice that there was mistake in my code too...
I just woke up a while ago so I haven't had time to apply it but
I wanted to say thanks now.

No problem. I woke up few minutes ago too. Too bad sun has already set
here...
I am always very grateful for the help I recieve and attempt to repay
it by helping others when I am in a position to do so.

Easy way to do that is to not top-post and trim quote when posting next
time:
http://www.allmyfaqs.com/faq.pl?How_to_post
 
D

Duende

While sitting in a puddle rf scribbled in the mud:
Yep. brucie is always that polite.

Albert Einstein was known to only be polite when he wanted something.
Otherwise he said & did whatever he damn well felt like saying & doing,
kinda like brucie.
 
S

Sharon Lee

Absolute rubbish.


Yep. brucie is always that polite.


Because he gives the Correct Answers.

Brucie has been very helpful to me on a number of occasions.

He should post his wisdom on a website somewhere. He could call it
'Brucie explains it all" at 'brucieexplains.com' and compete head to
head with little Lissa at http://www.lissaexplains.com/

Anyway I have had a fun day with DIV, I finished rewriting a page and
removed all table elements. It is amazing the level of control it
gives over the layout after fooling around with tables for so long.
However, I somehow feel more confident with tables and cells than a
row of images arranged with 'float'. That will come with more
practice.

It must be at least 5 times faster to code with DIV instead of tables.
That means I can make 5 times more mistakes per day and ask Brucie 5
times more questions and Brucie will get 5 times more opportunities to
swear !

So Brucie ... there has been a benefit to me learning about the DIV
tag after all ;)
 
T

T. Audry Glamour

Brucie has been very helpful to me on a number of occasions.

He should post his wisdom on a website somewhere. He could call it
'Brucie explains it all" at 'brucieexplains.com' and compete head to
head with little Lissa at http://www.lissaexplains.com/

Guess you haven't checked out http://bruciesusenetshit.info/ yet? Of
course, compared to "little Lissa" his is a minimalist approach.

I don't know that he would want to compete "head to head" with her,
either. Cue...

Audry
 

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

Members online

No members online now.

Forum statistics

Threads
473,768
Messages
2,569,575
Members
45,053
Latest member
billing-software

Latest Threads

Top