Table layout conumdrum - surely something simple...?

Rudi Cheow

Hey folks,

Something really doesn't make sense to me. Maybe you guys can figure
it out:
Code Set 1:

<---START CODE--->
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
</head>
<body>
<table width="100%" height="100%">
<tr>
<td valign="middle">aaa</td>
</tr>
</table>
</body>
</html>
<---END CODE--->
Code Set 2:

<---START CODE--->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
</head>
<body>
<table width="100%" height="100%">
<tr>
<td valign="middle">aaa</td>
</tr>
</table>
</body>
</html>
<---END CODE--->
The only difference between these sets of code is the "<!DOCTYPE HTML
PUBLIC..." entry which appears in Code Set 2 but not in 1.

In Code Set 1 a text string "aaa" appears centered in a browser
window. In Code Set 2 this text string is top aligned - it is not
centered. Tested and consistent in IE6 and NN7.

What gives? Does the "<!DOCTYPE" entry carry so much significance? I
always thought it was redundant.

Thanks,
Rudi

Jul 20 '05 #1

Subscribe Post Reply

1931

CJM

Simply speaking, the DOCTYPE statement tells the browser whether to render
the HTML in Standards-compliant mode or in Quirks mode (non-standard,
browser-specific).

With a few exceptions, if you include a valid DOCTYPE in your pages, they
will render the same in any browser (a good thing!).

I say with a few exceptions because some browsers dont follow the all the
W3C guidlines correctly so there are still slight differences in behaviour
but it as good as it gets, I guess.

Conclusion. Include a valid DOCTYPE in all pages.

http://www.alistapart.com/stories/doctype/

Chris

"Rudi Cheow" <ne****************@rudicheow.com> wrote in message
news:a5**************************@posting.google.c om...

Hey folks,

Something really doesn't make sense to me. Maybe you guys can figure
it out:
Code Set 1:

<---START CODE--->
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
</head>
<body>
<table width="100%" height="100%">
<tr>
<td valign="middle">aaa</td>
</tr>
</table>
</body>
</html>
<---END CODE--->
Code Set 2:

<---START CODE--->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
</head>
<body>
<table width="100%" height="100%">
<tr>
<td valign="middle">aaa</td>
</tr>
</table>
</body>
</html>
<---END CODE--->
The only difference between these sets of code is the "<!DOCTYPE HTML
PUBLIC..." entry which appears in Code Set 2 but not in 1.

In Code Set 1 a text string "aaa" appears centered in a browser
window. In Code Set 2 this text string is top aligned - it is not
centered. Tested and consistent in IE6 and NN7.

What gives? Does the "<!DOCTYPE" entry carry so much significance? I
always thought it was redundant.

Thanks,
Rudi

Jul 20 '05 #2

Rudi Cheow

Conclusion. Include a valid DOCTYPE in all pages.

Thanks for the explanation.

However, when I insert a modern DOCTYPE the page doesn't render the
way I want it to (I want elements centered vertically in a page), by
example of the code sets I gave in my original post. Am I doing
something wrong that does not strictly conform to DOCTYPE standards?
Is there a way to use current DOCTYPEs but acheive what I want to do?
If I choose not to use DOCTYPES are the effects horrible?

Sorry for the pain, but DOCTYPEs appear to work *against* what I want
to do, and the method I am using is the same method many recommend, so
what gives?

Cheers,
Rudi

Jul 20 '05 #3

Mark Parnell

Sometime around 16 Oct 2003 14:57:39 -0700, Rudi Cheow is reported to have
stated:

[Please attribute what you are quoting]

CJM said:
Conclusion. Include a valid DOCTYPE in all pages.
Thanks for the explanation.

However, when I insert a modern DOCTYPE the page doesn't render the
way I want it to (I want elements centered vertically in a page), by
example of the code sets I gave in my original post. Am I doing
something wrong that does not strictly conform to DOCTYPE standards?

Generally, that would be the case.
Is there a way to use current DOCTYPEs but acheive what I want to do?
What are you actually trying to do? Surely your page doesn't consist only
of "aaa" in the middle of the page?
If I choose not to use DOCTYPES are the effects horrible?
The effects are unpredictable. In many cases, yes that means horrible.

Sorry for the pain, but DOCTYPEs appear to work *against* what I want
to do, and the method I am using is the same method many recommend, so
what gives?

It sounds like it is unlikely that it is actually tabular data, so tables
are an inappropriate tool.

Centring text is awkward, due to various browser bugs.
http://dorward.me.uk/www/centre explains it well.

--
Mark Parnell
http://www.clarkecomputers.com.au

Jul 20 '05 #4

Similar topics

How to do a <table> with <div> tag

by: Toby Austin | last post by:

I'm trying to replace <table>s with <div>s as much as possible. However, I can't figure out how to do the following… <table> <tr> <td valign="top" width="100%">some data that will...

HTML / CSS

table percentage problem

by: mr_burns | last post by:

hi, is the table percent value for height used for displaying in browsers. i have a table i want to run to the bottom of the screen so it seemed best to set the height value to 100%. when i...

HTML / CSS

table-less layout & forms

by: Zak McGregor | last post by:

Hi all Are there any good solutions to aligning form field names and input boxes without resorting to tables? I am struggling to do this nicely at the moment. Thanks Ciao Zak

HTML / CSS

Table cell width ignored in IE6

by: Philipp Lenssen | last post by:

I have a site that runs in strict mode in IE6, and IE is making <td>s for simple two-digit numbers really wide. So I want to restrict it (and right-align it) by using <td class="number"> and...

HTML / CSS

Table Layout and What's Wrong With it

by: Neal | last post by:

Patrick Griffiths weighs in on the CSS vs table layout debate in his blog entry "Tables my ass" - http://www.htmldog.com/ptg/archives/000049.php . A quite good article.

HTML / CSS

Is it better to use cell spacing for table layout

by: Ryan | last post by:

I am not a web programmer and trying to figure out the best way for laying out a form for data entry. I would like, for example, to have a right justified label followed by 5 pixals and a left...

ASP.NET

117

grid structures: TABLE/TR/TD vs. DIV

by: phil-news-nospam | last post by:

Is there really any advantage to using DIV elements with float style properies, vs. the old method of TABLE and TR and TD? I'm finding that by using DIV, it still involves the same number of...

HTML / CSS

Does C#.Net support Layout managers?

by: Anoop | last post by:

Hi, I am new to this newsgroup and need help in the following questions. 1. I am workin' on a GUI application. Does C# provides Layout Managers the way Java does to design GUI? I know that it...

C# / C Sharp

table recreated using css

by: Aljosa Mohorovic | last post by:

i would like to recreate table displayed at http://fakanana.com/test/layout_1-3-1.html using css with doctype: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://...

HTML / CSS

How to turn on java script in a villaon keypad mobile phone

by: Charles Arthur | last post by:

How do i turn on java script on a villaon, callus and itel keypad mobile phone

Java

Merging data from multiple Excel files

by: ryjfgjl | last post by:

In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...

Data Management

Migrating Website to Cloud - Emmanuel Katto

by: emmanuelkatto | last post by:

Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel

General

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...

General

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

Career Advice