margaux Posted May 17, 2013 Share Posted May 17, 2013 I've nearly finished on a form for someone and its working fine except for a couple of display errors. 1. Form validation errors are displayed in a span next to the corresponding form field, but the error messages are not picking up the css. When I tested using html only, the css styles were applied. Here is the html output <!DOCTYPE html> <html> <head> <!--[if lt IE 9]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <meta charset="utf-8"> <title>Circuit Quote - assembly only budget</title><link href="styles.css" rel="stylesheet" type ="text/css" /> </head> <body> <div class="formWrap"> <form action="#" method="post"> <p>Circuit Quantity<label for="circuit_qty"><input type="number" id="circuit_qty" name="circuit_qty"/></label> <span class="error">Please enter a quantity</span></p> <p>Number of Different Components per Circuit<label for="num_circuit_components"><input type="number" id="num_circuit_components" name="num_circuit_components"/></label> <span class="error">Please enter the number of different components per circuit.</span></p> <p>Email me my quote<label for="email"><input type="email" id="email" name="email" size="30" placeholder="Enter your email address here"/></label> <span class="error">Please enter a valid email address</span></p> <p><input type="submit" value="submit" class="button" /><input type="hidden" value="aob" name="form_name" /></p> </form> <p class="centre">Assembly only budget quotation</p> </div> </body> </html> and here is the php script <div class="formWrap"> <form action="#" method="post"> <p>Circuit Quantity<label for="circuit_qty"><input type="number" id="circuit_qty" name="circuit_qty"/></label> <?php if (isset($errors['circuit_qty'])) echo '<span class="error">' .$errors['circuit_qty'] . '</span>';?></p> <p>Email me my quote<label for="email"><input type="email" id="email" name="email" size="30" placeholder="Enter your email address here"/></label> <?php if (isset($errors['email'])) echo '<span class="error">' .$errors['email'] . '</span>';?></p> <p><input type="submit" value="submit" class="button" /><input type="hidden" value="aob" name="form_name" /></p> </form> and the css .formWrap {width:90%;margin:20px auto; background-color:#151b97; color:#d7d7d7; font-family:trebuchet, sans-serif;padding:10px; overflow:hidden;} .clear {clear:both; } input {border:1px solid yellow; background-color:#151b97;margin-left:15px; color:yellow; width:120px;} input[type=email]{width:300px;} .clearfix {clear:both;} #data_table {width:60%; margin:auto;} td {padding:2px 4px;} .button {color:#d7d7d7; border:1px solid #d7d7d7;} .centre {text-align:center;} .error { color:#d9a100; } I've run the html and the css through the W3C validators and no errors came up. So this is puzzling. 2. I'm using money_format() to display a table of prices and want the prices to align vertically in the columns so that all the commas and decimal points are aligned. I've looked up the function in the php manual and I"m not sure this function caters for what I want. Anyone know of an alternative? Link to comment Share on other sites More sharing options...
HartleySan Posted May 17, 2013 Share Posted May 17, 2013 I put your HTML and CSS into a file together and the error class was properly applied, making the text orange. Basically, the CSS seems to be applied properly. What exactly is the problem you're experiencing? As for the alignment of the numbers, I'd just use number_format, and add two numbers after the decimal place. If you right-align the numbers (and possibly use a monospaced font), you should be fine. Link to comment Share on other sites More sharing options...
margaux Posted May 18, 2013 Author Share Posted May 18, 2013 This is embarrassing. The wrong css file was being picked up as a consequence of moving the files between local and staging directories. All good. Sorry for wasting your time!!! Hangs head in shame Link to comment Share on other sites More sharing options...
HartleySan Posted May 18, 2013 Share Posted May 18, 2013 I've done that before. Link to comment Share on other sites More sharing options...
Recommended Posts