Text element's width is too wide when doctype is set to XHTML

03-23-2007

I've read a bunch of posts on this and none of the answers are
legitimate (IMHO) so I thought I'd throw it out there again.

Using the html code below, if you set the doctype to HTML 4.0, and
view the page in IE 6 or 7, the text element fills the table cell
perfectly.
If you change the doctype to XHTML 1.0, the text element extends
beyond the width of the table cell.
On the other hand, if you view the page in FireFox, the page displays
perfectly regardless of which doctype you use.

I'm really looking for a better solution than to set the doctype to
HTML 4.0. Or perhaps is this just another anomaly in IE?

Please note that I have included both doc type headers. The first
doctype header is always used so just reverse the order to try each
one out.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<table>
<tr>
<td width="200">
<input type="text" style="width:100%" />
</td>
</tr>
</table>
</body>
</html>

03-23-2007

you just need to understand html 4.0. object have a width, border and
margin. the border and margin extend beyond the width. so if you make an
object 100px wide with a 2px margin and a 2px border it will be 108px
wide. if you make the width 100% (of the parent), with margin and border
it will be 8px wider than the parent. now if the parent has padding the
control is offset and will extend beyond the parent unless overflow is set.

because you are not setting the borders, margins, and padding, you get
the default, which differs by browser.

-- bruce (sqlwork.com)

wrote:
> I've read a bunch of posts on this and none of the answers are
> legitimate (IMHO) so I thought I'd throw it out there again.
>
> Using the html code below, if you set the doctype to HTML 4.0, and
> view the page in IE 6 or 7, the text element fills the table cell
> perfectly.
> If you change the doctype to XHTML 1.0, the text element extends
> beyond the width of the table cell.
> On the other hand, if you view the page in FireFox, the page displays
> perfectly regardless of which doctype you use.
>
> I'm really looking for a better solution than to set the doctype to
> HTML 4.0. Or perhaps is this just another anomaly in IE?
>
> Please note that I have included both doc type headers. The first
> doctype header is always used so just reverse the order to try each
> one out.
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
> www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
> <html xmlns="http://www.w3.org/1999/xhtml">
> <body>
> <table>
> <tr>
> <td width="200">
> <input type="text" style="width:100%" />
> </td>
> </tr>
> </table>
> </body>
> </html>
>

03-23-2007

I've done a bit more research, and understand what you mean, but that
that really only applies for XHTML doctypes. HTML doc types
automatically take these other factors into account when determining
the display width of an object whose style width is set to 100%.

Apparently XHTML uses a strict box model which really causes a lot of
aggravation when laying out a web page. Another example being that you
can't set the height of a Table inline, you have to set it in the
style sheet. I'm okay with that as long as the XHTML doctype is used
in the appropriate situations.

Having said all that, why oh why did Microsoft decide to set the
default doctype to XHTML for new WebForms in VS 2005. That is
completely idiotic considering the aggravation it will cause for the
majority of developers.

mike

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
CSS Newbie - CSS Works With Invalid DOCTYPE. Fails With Valid DOCTYPE.	Larry Lindstrom	HTML	19	06-12-2012 02:07 PM
parse URL (href) from xhtml, xhtml -> text, for data	hawat.thufir@gmail.com	XML	7	02-08-2006 07:39 PM
Textbox width scaling to width of data not width of page?	AndrewF	ASP .Net	1	10-10-2005 04:38 PM
XSLT XHTML MIX DOCTYPE PROBLEM	Tjerk Wolterink	XML	13	02-14-2005 07:11 PM
XHTML - Doctype and output	johkar	XML	3	10-09-2004 12:39 AM