Replace Tables with CSS

[Malcolm Collett]

http://users.iafrica.com/m/mc/mcollett/Testing/Testing.htm

I am just playing around, learning how to replace tables with CSS.

At the above URL, I have some <div>s, some on the left and some on the
right.
There is something I don't understand:

The <div>s on the left appear as I expect them to, but the <div>s on the
right have white space above and below the content. As if padding-top and
padding-bottom have been used. I don't understand where this has come from.

Where does this white space come from and what is the best way to get the
left and right divs to display the same?

Thanks
Malcolm

 

[Barry Pearson]

http://users.iafrica.com/m/mc/mcollett/Testing/Testing.htm

I am just playing around, learning how to replace tables with CSS.

At the above URL, I have some <div>s, some on the left and some on the
right.
There is something I don't understand:

The <div>s on the left appear as I expect them to, but the <div>s on
the right have white space above and below the content. As if
padding-top and padding-bottom have been used. I don't understand
where this has come from.

Where does this white space come from and what is the best way to get
the left and right divs to display the same?

Mozilla Firebird & Netscape show similar space above the headings. (Like the
ones on the right in IE).

Opera shows different space, like IE, but doesn't align the tops of the divs
in the way that IE 6 does.

The CSS can't be found. The W3C validation service returned:
"I was not able to extract a character encoding labeling from any of the valid
sources for such information. Without encoding information it is impossible to
validate the document."

I suggest you sort out the validation issues then see what happens.

 

[Robert Frost-Bridges]

http://users.iafrica.com/m/mc/mcollett/Testing/Testing.htm

I am just playing around, learning how to replace tables with CSS.

At the above URL, I have some <div>s, some on the left and some on the
right.
There is something I don't understand:

The <div>s on the left appear as I expect them to, but the <div>s on
the right have white space above and below the content. As if
padding-top and padding-bottom have been used. I don't understand
where this has come from.

Where does this white space come from and what is the best way to get
the left and right divs to display the same?

I'm not sure what you expect them to look like but both sides look the
same to me (in Konqueror).

Btw, whilst 'rel' is an attribute of <link> it's not an attribute of
<style>.

http://www.w3.org/TR/1998/REC-html40-19980424/present/styles.html#edef-STYLE