krow Posted October 18, 2012 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 Link to comment Share on other sites More sharing options...
niche Posted October 18, 2012 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 Link to comment Share on other sites More sharing options...
ShadowMage Posted October 18, 2012 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. Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now