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

M

mszanto

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>
 
B

bruce barker

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)
 
M

mszanto

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
 

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

Similar Threads

Can someone tell me if this a real tracker? Or is it one designed to show you a different message at certain times, ie. acting like one? 0
XHTML - how extend/create ELEMENT body in my DTD? 0
newbie, trouble with doctype update 7
XHTML Doctype? 14
Image shifts to the right when export the page to pdf 4
DOCTYPE related question 7
Problem rendering a 100% width textbox on IE using XHTML 1.0 stand 1
Do I need <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ..... in asp.net 2.0 ? 6

Members online

Total: 60 (members: 3, guests: 57)
Robots: 392

Forum statistics

Threads
473,982
Messages
2,570,186
Members
46,744
Latest member
CortneyMcK

Latest Threads

Top