Jump to content

Dimensions of text field vs div


jdp2000
 Share

Recommended Posts

Hi,I have a problem trying to get a form text field to match text in a div. It appears to be a problem in Safari and Firefox on mac but not on IE7<html> <body> <form> <input style="margin: 0px; padding: 0px; height: 30px; width: 300px; border: 1px solid grey;" type="text" value="some text"/> <div style="margin: 0px; padding: 0px; height: 30px; width: 300px; border: 1px solid grey;">some text</div> </form> </body></html>The height and width of the form field are a couple of pixels more than the div.Any help appreciated,Thanks,JD

Link to comment
Share on other sites

I'm able to get the <input> element to display right all browsers except Internet Explorer with this code:

<input type="text" style="border: 1px solid #999; width: 300px;"><div style="width: 300px; border: 1px solid #999;">Some text</div>

Link to comment
Share on other sites

I'm able to get the <input> element to display right all browsers except Internet Explorer with this code:
<input type="text" style="border: 1px solid #999; width: 300px;"><div style="width: 300px; border: 1px solid #999;">Some text</div>

Thanks, I have it working now. The DocType did the trick. I also had the problem where IE stopped showing the border on the div but I changed the combined form to separate values like this:<!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" xml:lang="en" lang="en"> <head> <title></title> </head> <body> <form action=""> <fieldset> <input style="margin: 0px; padding: 0px; height: 30px; width: 300px; border-style: solid; border-width: 1px;" type="text" value="some text"/> <div style="margin: 0px; padding: 0px; height: 30px; width: 300px; border-style: solid; border-width: 1px;">some text</div> </fieldset> </form> </body></html>
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...