Jump to content

Problem with the width of my Contact Form


Recommended Posts

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 by krow
Link to post
Share on other sites
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 by niche
Link to post
Share on other sites

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 post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...