jdp2000 Posted August 15, 2008 Share Posted August 15, 2008 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 More sharing options...
SpOrTsDuDe.Reese Posted August 15, 2008 Share Posted August 15, 2008 Add a DTD to your page <!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"> Link to comment Share on other sites More sharing options...
Ingolme Posted August 15, 2008 Share Posted August 15, 2008 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 More sharing options...
jdp2000 Posted August 16, 2008 Author Share Posted August 16, 2008 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 More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.