472,951 Members | 1,479 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 472,951 software developers and data experts.

How is DocType related to text input width?

2
Hello. Is there anybody who can give me an explanation, why the actual width of the textboxes in my two examples is different? (Second example is missing a DocType declaration.)

After that, I would like to know how to set the textbox to the same width as combox if I want to include a DocType declaration?

Thanks in advance.

Example 1
Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html>
  3. <head>
  4.     <style>
  5.         input { width: 40em; }
  6.         select { width: 40em; }
  7.     </style>
  8. </head>
  9. <body>
  10.     <input type="text"></input>
  11.     <br />
  12.     <select></select>
  13. </body>
  14. </html>
  15.  
Example 2
Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3.     <style>
  4.         input { width: 40em; }
  5.         select { width: 40em; }
  6.     </style>
  7. </head>
  8. <body>
  9.     <input type="text"></input>
  10.     <br />
  11.     <select></select>
  12. </body>
  13. </html>
  14.  
Mar 6 '08 #1
2 2097
drhowarddrfine
7,435 Expert 4TB
Without a doctype, you are in "quirks mode". This is an error created in ancient times where the width of an element was calculated with margins contained within the total width. Using a doctype changes the rules to "standards mode" and margins are properly calculated outside the total width.
Mar 6 '08 #2
kolik
2
Without a doctype, you are in "quirks mode". This is an error created in ancient times where the width of an element was calculated with margins contained within the total width. Using a doctype changes the rules to "standards mode" and margins are properly calculated outside the total width.
Thanks for your reply!

Nevertheless, I have another question: why does it not apply to the select as well? And is there any workaround so that I can make those two inputs the same width?
Mar 6 '08 #3

Sign in to post your reply or Sign up for a free account.

Similar topics

9
by: Robert Misiorowski | last post by:
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...
6
by: Patrick | last post by:
Hi I am fairly new to CSS and the web.I am trying to build a site more to practice my skills than for the site itself. I have been focusing on CSS and try my best to make it work in I.E 6.0,...
6
by: Chris Botha | last post by:
I am porting an existing 2003 project to 2005. Yesterday I found that some of my Java script did not want to work. After eventually examining the HTML view of the new and old form for differences,...
50
by: Shadow Lynx | last post by:
Consider this simple HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 STRICT//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head>...
3
by: cbradio | last post by:
Hi, I am having trouble developing a form in a restricted environment. My sample code is found below my message (sorry I don't have a URL). Basically, without a doctype, the form displays properly...
3
w33nie
by: w33nie | last post by:
I want to disable the text boxes, captain_name and captain_email, but only if the radio button, captain_guarantee, has NOT been checked. how do i do this? <form name="formTeamApplication"...
2
by: mszanto | last post by:
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...
0
by: =?Utf-8?B?SGFyZHkgV2FuZw==?= | last post by:
Hi all, I have a web form, and I want to use ModalPopupExtender from Ajax Toolkit. I am using IE 7.0 as browser, VS 2005 and Ajax and Ajax Tool Kit installed. Windows XP Pro. Now I have a...
1
by: rfr | last post by:
Apparently the Transitional Doctype kills this script because the script does not make proper use of units like "px". It works well without a doctype statement. But once someone adds a...
0
by: Mushico | last post by:
How to calculate date of retirement from date of birth
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 4 Oct 2023 starting at 18:00 UK time (6PM UTC+1) and finishing at about 19:15 (7.15PM) The start time is equivalent to 19:00 (7PM) in Central...
0
by: Aliciasmith | last post by:
In an age dominated by smartphones, having a mobile app for your business is no longer an option; it's a necessity. Whether you're a startup or an established enterprise, finding the right mobile app...
0
tracyyun
by: tracyyun | last post by:
Hello everyone, I have a question and would like some advice on network connectivity. I have one computer connected to my router via WiFi, but I have two other computers that I want to be able to...
4
NeoPa
by: NeoPa | last post by:
Hello everyone. I find myself stuck trying to find the VBA way to get Access to create a PDF of the currently-selected (and open) object (Form or Report). I know it can be done by selecting :...
3
NeoPa
by: NeoPa | last post by:
Introduction For this article I'll be using a very simple database which has Form (clsForm) & Report (clsReport) classes that simply handle making the calling Form invisible until the Form, or all...
1
by: Teri B | last post by:
Hi, I have created a sub-form Roles. In my course form the user selects the roles assigned to the course. 0ne-to-many. One course many roles. Then I created a report based on the Course form and...
0
NeoPa
by: NeoPa | last post by:
Introduction For this article I'll be focusing on the Report (clsReport) class. This simply handles making the calling Form invisible until all of the Reports opened by it have been closed, when it...
0
isladogs
by: isladogs | last post by:
The next online meeting of the Access Europe User Group will be on Wednesday 6 Dec 2023 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, Mike...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.