1,105,406 Community Members

Spry Validation Textfield Moves Entire Form to the Left

Member Avatar
martin11ph
Junior Poster in Training
76 posts since Jan 2011
Reputation Points: -3 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

Hi good day.

I am currently using Spry Textfield Validation on my forms. Whenever there is an error, the error message does appear and the field goes red. However, the entire form is shifted to the left a couple of pixels. If the user corrects the value in the field, the form goes back to the right. What is wrong with this? I am using the default code on DreamWeaver. Here are the concerned parts of the code:

<script src="SpryAssets/SpryValidationTextField.js" type="text/javascript"></script>
<link href="SpryAssets/SpryValidationTextField.css" rel="stylesheet" type="text/css">
...
<tr><td>Password:</td>
      <td><span id="sprytextfield1">
      <input type="text" name="password" value=""/>
      <span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldMinCharsMsg">Minimum number of characters not met.</span><span class="textfieldMaxCharsMsg">Exceeded maximum number of characters.</span></span></td>
  </tr>
...
var sprytextfield1 = new Spry.Widget.ValidationTextField("sprytextfield1", "none", {minChars:8, maxChars:20, validateOn:["blur"]});

Nothing was changed save for adding the min and max chars plus the validate on blur. Hope someone can help.

Member Avatar
phper
Posting Whiz in Training
209 posts since Nov 2006
Reputation Points: 9 [?]
Q&As Helped to Solve: 19 [?]
Skill Endorsements: 0 [?]
 
0
 

Its probably something in the CSS code - maybe there's a margin or padding being added in the textfieldRequiredMsg class.

Take a look in this file: SpryAssets/SpryValidationTextField.css

Member Avatar
martin11ph
Junior Poster in Training
76 posts since Jan 2011
Reputation Points: -3 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

Its probably something in the CSS code - maybe there's a margin or padding being added in the textfieldRequiredMsg class.

Take a look in this file: SpryAssets/SpryValidationTextField.css

Hi, thank you for taking a look at my problem. I checked the CSS and there is no margin or padding being added. I also checked the .js just to be sure.

I just discovered that when table align="center", this problem occurs. If align is not set and the table is on the left, there is no problem. I have no problem reverting to a form that is aligned left. However, it would be good to know what is causing this. :)

You
This article has been dead for over three months: Start a new discussion instead
Post:
Start New Discussion
View similar articles that have also been tagged: