By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,446 Members | 1,185 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,446 IT Pros & Developers. It's quick & easy.

very strange Doctype issue

P: n/a
Hello,

I have a very perplexing (at least to me) problem that hopefully
someone can help me with. I'm making a site with a 3 column layout. In the
middle column (my fluid column) I am trying to put a table of 99% width.
When I do this the table actually extends to the right over my right column
and off the screen. After much debugging and trying of different things, I
change this line in my code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
....i changed to...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">

and voila! the table was sized perfectly. The problem is though, that after
this change, my right column completely disappeared, even though there is
space left for it and all my CSS formatting to input boxes, fonts, etc... is
being ignored. Can anyone shed some light as to why this is happening? It
seems as if I am stuck with a choice between two poisons.

Thanks,

Robert.

Here is my code:

style sheet:

#top {
height:122px;
text-align: center;
voice-family: "\"}\"";
voice-family: inherit;
height:121px;
}
html>body #top {
height:121px;
}

body {
margin:10px 10px 0px 10px;
padding:0px;
}

#leftcontent {
position: absolute;
left:10px;
width:200px;
}

#centercontent {
margin-left: 199px;
margin-right:199px;
border:1px solid #000;
text-align: center;
voice-family: "\"}\"";
voice-family: inherit;
margin-left: 201px;
margin-right:201px;
}
html>body #centercontent {
margin-left: 201px;
margin-right:201px;
}

#rightcontent {
position: absolute;
right:10px;
width:200px;
}

input {
border: solid 1px CCCCCC;
background-color: 9999CC;
}

..login { font-family: Verdana, Arial, Helvetica, sans-serif; font-size:
11px; line-height: 12px; color: FFCC00;
background-color: 9999CC;}
..copy { font-family: Verdana, Arial, Helvetica, sans-serif; font-size:
x-small; line-height: 12px; color: FFCC00;}

----------------------------------------------------------------------------
----------------------
html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Co Sie Dzieje</title>
<link rel="stylesheet" href="CoSieDzieje.css" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
<!--
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document;
if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++)
x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++)
x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;

}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length;
i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_nbGroup(event, grpName) { //v6.0
var i,img,nbArr,args=MM_nbGroup.arguments;
if (event == "init" && args.length > 2) {
if ((img = MM_findObj(args[2])) != null && !img.MM_init) {
img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
if ((nbArr = document[grpName]) == null) nbArr = document[grpName] =
new Array();
nbArr[nbArr.length] = img;
for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) !=
null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = img.MM_dn = args[i+1];
nbArr[nbArr.length] = img;
} }
} else if (event == "over") {
document.MM_nbOver = nbArr = new Array();
for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i])) !=
null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])?
args[i+1] : img.MM_up);
nbArr[nbArr.length] = img;
}
} else if (event == "out" ) {
for (i=0; i < document.MM_nbOver.length; i++) {
img = document.MM_nbOver[i]; img.src = (img.MM_dn) ? img.MM_dn :
img.MM_up; }
} else if (event == "down") {
nbArr = document[grpName];
if (nbArr)
for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up;
img.MM_dn = 0; }
document[grpName] = nbArr = new Array();
for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) !=
null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
nbArr[nbArr.length] = img;
} }
}
//-->
</script>
</head>

<body bgcolor='black' class='copy'
onLoad="MM_preloadImages('images/btn_kluby_over.gif','images/btn_muzyka_over
..gif','images/btn_oldies_over.gif','images/btn_street_over.gif','images/btn_
disco_over.gif','images/btn_filmy_over.gif')">
<div id="top"><img src='images/top_bar.jpg' width=99% height=122
border='0'></div>

<div id="centercontent">
<table border=1 width='99%'>
<tr>
<td align='center'>Puntanga</td>
</tr>
</table>
</div>

<div id="leftcontent">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td><a href="#" target="_top"
onClick="MM_nbGroup('down','group1','btnMuzyka','' ,1)"
onMouseOver="MM_nbGroup('over','btnMuzyka','images/btn_muzyka_over.gif','',1
);" onMouseOut="MM_nbGroup('out');"><img src="images/btn_muzyka.gif" alt=""
name="btnMuzyka" width="148" height="21" border="0" onload=""></a></td>
</tr>
<tr>
<td><a href="#" target="_top"
onClick="MM_nbGroup('down','group1','btnOldies','' ,1)"
onMouseOver="MM_nbGroup('over','btnOldies','images/btn_oldies_over.gif','',1
)" onMouseOut="MM_nbGroup('out')"><img src="images/btn_oldies.gif" alt=""
name="btnOldies" width="148" height="21" border="0" onload=""></a></td>
</tr>
<tr>
<td><a href="#" target="_top"
onClick="MM_nbGroup('down','group1','btnStreet','' ,1)"
onMouseOver="MM_nbGroup('over','btnStreet','images/btn_street_over.gif','',1
)" onMouseOut="MM_nbGroup('out')"><img src="images/btn_street.gif" alt=""
name="btnStreet" width="148" height="21" border="0" onload=""></a></td>
</tr>
<tr>
<td><a href="#" target="_top"
onClick="MM_nbGroup('down','group1','btnDisco','', 1)"
onMouseOver="MM_nbGroup('over','btnDisco','images/btn_disco_over.gif','',1)"
onMouseOut="MM_nbGroup('out')"><img src="images/btn_disco.gif" alt=""
name="btnDisco" width="148" height="21" border="0" onload=""></a></td>
</tr>
<tr>
<td><a href="#" target="_top"
onClick="MM_nbGroup('down','group1','btnFilmy','', 1)"
onMouseOver="MM_nbGroup('over','btnFilmy','images/btn_filmy_over.gif','',1)"
onMouseOut="MM_nbGroup('out')"><img src="images/btn_filmy.gif" alt=""
name="btnFilmy" width="148" height="21" border="0" onload=""></a></td>
</tr>
<tr>
<td><a href="#" target="_top"
onClick="MM_nbGroup('down','group1','btnKluby','', 1)"
onMouseOver="MM_nbGroup('over','btnKluby','images/btn_kluby_over.gif','',1)"
onMouseOut="MM_nbGroup('out')"><img src="images/btn_kluby.gif" alt=""
name="btnKluby" width="148" height="21" border="0" onload=""></a></td>
</tr>
</table>

<br>
<TABLE WIDTH=153 BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD COLSPAN=3>
<IMG SRC="images/login_top.gif" WIDTH=153 HEIGHT=27 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG SRC="images/login_left_border.gif" WIDTH=6 HEIGHT=154 ALT=""></TD>
<TD class='login' align='center' valign='top'
background="images/login_bg.gif" width=139 height=154>
Pseudonim:<br><input class='login' type='text' maxlength='20' size='15'
name='txtUserName'><br>
Haslo:<br><input class='login' type='text' maxlength='20' size='15'
name='txtPW'><br>
<br>Not a member? <br>Click <a href='#'>here</a><br>
<br>Why become a member? Click <a href='#'>here</a> to find out.<br>
</TD>
<TD>
<IMG SRC="images/login_right_border.gif" WIDTH=8 HEIGHT=154 ALT=""></TD>
</TR>
<TR>
<TD COLSPAN=3>
<IMG SRC="images/login_bot.gif" WIDTH=153 HEIGHT=19 ALT=""></TD>
</TR>
</TABLE>
</div>

<div id="rightcontent">
nionoi sfodisfonosd fsdoifnsdo fsdfio sdf sdf sd fsd fsdfsd fsd fsd f sdf
sdf sd fs dfdsfsdfsd fs df sdf sd f sdf sd fsd
fsd fds fs df sdf sd fsdfsdf sd sdfsdfs dfdsdsf fsdfsdf sdfsdfsd fsd fsd fsd
f sdfsdf sdf sd fs df sd f sdfsdfsd f dsfsdfsd
</div>

</body>
</html>

Jul 20 '05 #1
Share this Question
Share on Google+
9 Replies


P: n/a
Robert Misiorowski wrote:
I have a very perplexing (at least to me) problem that hopefully
someone can help me with. I'm making a site with a 3 column layout. In the
middle column (my fluid column) I am trying to put a table of 99% width.
When I do this the table actually extends to the right over my right
column and off the screen. After much debugging and trying of different
things, I change this line in my code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
...i changed to...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd"> and voila! the table was sized perfectly.
Yes, Doctype switching was a very bad idea. Some browsers look at the
Doctype and use it to make assumptions about the author.

Some cause browsers to believe that the author is coding to standards and
thus causes them to try to follow the spec.

Others, or the lack of one, cause browsers to believe the author is fiddling
about without understanding what the code he is writing means and causes
them to act more like IE 5.5.

http://gutfeldt.ch/matthias/articles/doctypeswitch.html
The problem is though, that
after this change, my right column completely disappeared, even though
there is space left for it and all my CSS formatting to input boxes,
fonts, etc... is being ignored. Can anyone shed some light as to why this
is happening? It seems as if I am stuck with a choice between two poisons.


Start by switching to a Doctype that triggers standards mode (I'd suggest
HTML 4.01 Strict with a URI, it is listed on the above website) then take a
validator to your CSS and HTML, you have syntax errors in both. In
standards mode, browsers are less forgiving of syntax errors ("That's
wrong, I'll ignore it" rather then "That's wrong, *maybe* he was trying to
X").
--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Jul 20 '05 #2

P: n/a
Robert Misiorowski wrote:
I have a very perplexing (at least to me) problem that hopefully
someone can help me with. I'm making a site with a 3 column layout. In the
middle column (my fluid column) I am trying to put a table of 99% width.
When I do this the table actually extends to the right over my right
column and off the screen. After much debugging and trying of different
things, I change this line in my code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
...i changed to...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd"> and voila! the table was sized perfectly.
Yes, Doctype switching was a very bad idea. Some browsers look at the
Doctype and use it to make assumptions about the author.

Some cause browsers to believe that the author is coding to standards and
thus causes them to try to follow the spec.

Others, or the lack of one, cause browsers to believe the author is fiddling
about without understanding what the code he is writing means and causes
them to act more like IE 5.5.

http://gutfeldt.ch/matthias/articles/doctypeswitch.html
The problem is though, that
after this change, my right column completely disappeared, even though
there is space left for it and all my CSS formatting to input boxes,
fonts, etc... is being ignored. Can anyone shed some light as to why this
is happening? It seems as if I am stuck with a choice between two poisons.


Start by switching to a Doctype that triggers standards mode (I'd suggest
HTML 4.01 Strict with a URI, it is listed on the above website) then take a
validator to your CSS and HTML, you have syntax errors in both. In
standards mode, browsers are less forgiving of syntax errors ("That's
wrong, I'll ignore it" rather then "That's wrong, *maybe* he was trying to
X").
--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Jul 20 '05 #3

P: n/a
In article <xY********************@comcast.com>,
"Robert Misiorowski" <rm****@yahoo.com> writes:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
There's nothing inherently wrong with that, though any "Transitional"
is very unhelpful and only suitable for pre-1998 markup.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">
That's downright wrong, although unfortunately there are some typos in
published W3C material suggesting it. If you use that form, the
DTD argument must be a full URL.
and voila! the table was sized perfectly.
You forgot to say which browser's bugs you're working to.
Here is my code:


I've absolutely no intention of wading through that lot. But it doesn't
take more than a glance to see that you need a visit to a validator
and to a reputable tutorial.
--
Nick Kew

Nick's manifesto: http://www.htmlhelp.com/~nick/
Jul 20 '05 #4

P: n/a
In article <xY********************@comcast.com>,
"Robert Misiorowski" <rm****@yahoo.com> writes:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
There's nothing inherently wrong with that, though any "Transitional"
is very unhelpful and only suitable for pre-1998 markup.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">
That's downright wrong, although unfortunately there are some typos in
published W3C material suggesting it. If you use that form, the
DTD argument must be a full URL.
and voila! the table was sized perfectly.
You forgot to say which browser's bugs you're working to.
Here is my code:


I've absolutely no intention of wading through that lot. But it doesn't
take more than a glance to see that you need a visit to a validator
and to a reputable tutorial.
--
Nick Kew

Nick's manifesto: http://www.htmlhelp.com/~nick/
Jul 20 '05 #5

P: n/a
ni**@hugin.webthing.com (Nick Kew) wrote:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
There's nothing inherently wrong with that, though any "Transitional"
is very unhelpful and only suitable for pre-1998 markup.


Except in the Real World, where CSS is not perfect yet (as regards to
specifications - there are Transitional HTML features that lack CSS
counterpart - and especially as regards to implementations).
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">


That's downright wrong, although unfortunately there are some typos
in published W3C material suggesting it. If you use that form, the
DTD argument must be a full URL.


Please don't mix up your negative attitudes with factual errors - W3C
itself has taken care of creating a confusion where substantial content
changes are included into "Errata", they need no help from us in such
issues.

Moreover, please don't confuse the phenomenon of doctype sniffing with
the question of correctness of document type declarations. The XHTML 1.0
specification is vague, but it says: "The system identifier may be
changed to reflect local system conventions." It does not explicitly say
that the system identifier is required at all. On the other hand, the
HTML 4.01 specification says: "HTML 4.01 specifies three DTDs, so authors
must include one of the following document type declarations in their
documents." and then lists three alternatives, and this really looks like
a requirement to use one of them, literally, making your first statement
incorrect.
But it
doesn't take more than a glance to see that you need a visit to a
validator and to a reputable tutorial.


In the opposite order, I would say. A visit to a validator can hardly
cause anything else than thorough confusion to anyone who does not know
the basics of HTML and the way in which they have been formalized.
Validation _is_ a formal thing.

Followups trimmed.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Jul 20 '05 #6

P: n/a
ni**@hugin.webthing.com (Nick Kew) wrote:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
There's nothing inherently wrong with that, though any "Transitional"
is very unhelpful and only suitable for pre-1998 markup.


Except in the Real World, where CSS is not perfect yet (as regards to
specifications - there are Transitional HTML features that lack CSS
counterpart - and especially as regards to implementations).
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">


That's downright wrong, although unfortunately there are some typos
in published W3C material suggesting it. If you use that form, the
DTD argument must be a full URL.


Please don't mix up your negative attitudes with factual errors - W3C
itself has taken care of creating a confusion where substantial content
changes are included into "Errata", they need no help from us in such
issues.

Moreover, please don't confuse the phenomenon of doctype sniffing with
the question of correctness of document type declarations. The XHTML 1.0
specification is vague, but it says: "The system identifier may be
changed to reflect local system conventions." It does not explicitly say
that the system identifier is required at all. On the other hand, the
HTML 4.01 specification says: "HTML 4.01 specifies three DTDs, so authors
must include one of the following document type declarations in their
documents." and then lists three alternatives, and this really looks like
a requirement to use one of them, literally, making your first statement
incorrect.
But it
doesn't take more than a glance to see that you need a visit to a
validator and to a reputable tutorial.


In the opposite order, I would say. A visit to a validator can hardly
cause anything else than thorough confusion to anyone who does not know
the basics of HTML and the way in which they have been formalized.
Validation _is_ a formal thing.

Followups trimmed.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Jul 20 '05 #7

P: n/a
This happens on Internet Explorer v6.0. In Netscape, the table properly
resizes with the Doctype line the first way.

"Nick Kew" <ni**@hugin.webthing.com> wrote in message
news:nj***********@webthing.com...
In article <xY********************@comcast.com>,
"Robert Misiorowski" <rm****@yahoo.com> writes:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


There's nothing inherently wrong with that, though any "Transitional"
is very unhelpful and only suitable for pre-1998 markup.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">


That's downright wrong, although unfortunately there are some typos in
published W3C material suggesting it. If you use that form, the
DTD argument must be a full URL.
and voila! the table was sized perfectly.


You forgot to say which browser's bugs you're working to.
Here is my code:


I've absolutely no intention of wading through that lot. But it doesn't
take more than a glance to see that you need a visit to a validator
and to a reputable tutorial.
--
Nick Kew

Nick's manifesto: http://www.htmlhelp.com/~nick/

Jul 20 '05 #8

P: n/a
This happens on Internet Explorer v6.0. In Netscape, the table properly
resizes with the Doctype line the first way.

"Nick Kew" <ni**@hugin.webthing.com> wrote in message
news:nj***********@webthing.com...
In article <xY********************@comcast.com>,
"Robert Misiorowski" <rm****@yahoo.com> writes:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


There's nothing inherently wrong with that, though any "Transitional"
is very unhelpful and only suitable for pre-1998 markup.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">


That's downright wrong, although unfortunately there are some typos in
published W3C material suggesting it. If you use that form, the
DTD argument must be a full URL.
and voila! the table was sized perfectly.


You forgot to say which browser's bugs you're working to.
Here is my code:


I've absolutely no intention of wading through that lot. But it doesn't
take more than a glance to see that you need a visit to a validator
and to a reputable tutorial.
--
Nick Kew

Nick's manifesto: http://www.htmlhelp.com/~nick/

Jul 20 '05 #9

P: n/a
Robert Misiorowski scribbled something along the lines of:
This happens on Internet Explorer v6.0. In Netscape, the table properly
resizes with the Doctype line the first way.

"Nick Kew" <ni**@hugin.webthing.com> wrote in message
news:nj***********@webthing.com...

<snip/>

This being Usenet maybe I should tell you now that topposting is
considered an invitation to unpleasant reactions and should be avoided
before someone thinks they need to demonstrate that behavior.

--
Alan Plum, WAD/WD, Mushroom Cloud Productions
http://www.mushroom-cloud.com/
Jul 20 '05 #10

This discussion thread is closed

Replies have been disabled for this discussion.