krow 0 Posted October 18, 2012 Report Share Posted October 18, 2012 (edited) Hello Is there any way to make my form set its width automatically based on the width of my fields? The problem I have is this, when I set the width of my form (e.g. 350px) and reduce the screen resolution to the minimum (Ctrl + mouse wheel) then the fields inside the form get totally messed up, i.e. the form frame becomes even smaller than the actual text areas. I wonder if there's any way I can achieve this so that regardless of the screen resolution they still preserve the same layout? thanks a lot. ps sorry about the formatting of my html code, aren't the tags supposed to indent it?. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252" /><title>Contact Form</title><link href="css/styles.css" rel="stylesheet" type="text/css" /> <style type="text/css">form{border:#333333 1px dotted;padding:10px;background:#EAEAEA;border-radius:7px;margin:15px;}form td{padding:1px;}th{background:#B1D8FF;padding:5px;}textarea{resize:none;}h1{font-family:"Times New Roman", Times, serif;text-align:left;font-size:20px;}label{color:#292929;}#below-title-text{font-style:italic;font-size:16px;text-align:left;padding:10px 0;}#submit-button{width:130px;height:40px;background:#B1D8FF;border-radius:5px;}</style> </head> <body><p>Any questions, doubts or suggestions?</p><form action="donate.php" method="post" name="donation form"><table><th colspan="2"><h1 >Contact Us!</h1></th><tr><td width="74"><label for ="name">Name</label></td><td width="180"><input type="text" name="name" maxlength="50" size="30"/></td></tr><tr><td><label for ="password">Email</label></td><td><input type="text" name="email" maxlength="50" size="30"/></td></tr><tr><td><label for="donation">Subject</label></td><td><input type="text" name="subject" maxlength="50" size="30"/></td></tr><tr><td colspan="2"><label for="comments">Comments</label></td></tr><tr><td colspan="2"><textarea id="ta1" name="comments" rows=10 cols=40 onKeyDown="textCounter('ta1','ta1count',300);" onKeyUp="textCounter('ta1','ta1count',300);"></textarea></td></tr><tr><td></td><td ><input name="submit" type="submit" id="submit-button" value="Submit" /></td></tr></table></form></body></html> Edited October 18, 2012 by krow Quote Link to post Share on other sites
niche 132 Posted October 18, 2012 Report Share Posted October 18, 2012 (edited) Is there any way to make my form set its width automatically based on the width of my fields?Not without javascript or php. Can you code with either of them. Edited October 18, 2012 by niche Quote Link to post Share on other sites
ShadowMage 94 Posted October 18, 2012 Report Share Posted October 18, 2012 Just put a min-width on the form. 330px seemed to work well for me. Then the form will never get smaller than 330px. ps sorry about the formatting of my html code, aren't the tags supposed to indent it?.Only if you already have it indented. They preserve your formatting, they don't format it for you. Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.