paulmo Posted May 9, 2010 Report Share Posted May 9, 2010 (edited) I am attempting CSS styling in my PHP e-mail form, but the styling is not showing. The form works without the CSS and JS. Please take a look: //section of CSS and JS from <head> below#inputArea { font-family: Arial, Sans-Serif; font-size: 13px; background-color: #d6e5f4; padding: 10px; width:310px; } #inputArea input, #inputArea textarea { font-family: Arial, Sans-Serif; font-size: 13px; margin-bottom: 5px; display: block; padding: 4px; width: 300px; } .activeField { background-image: none; background-color: #ffffff; border: solid 1px #33677F; } .idle { border: solid 1px #85b1de; background-image: url( 'blue_bg.png' ); background-repeat: repeat-x; background-position: top; } </style>//jquery file is accessible. <script src="jquery-1.4.2.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function(){ $("input, textarea").addClass("idle"); $("input, textarea").focus(function(){ $(this).addClass("activeField").removeClass("idle"); }).blur(function(){ $(this).removeClass("activeField").addClass("idle"); }); }); </script>//PHP and e-mail form below.<?phpfunction spamcheck($field) { $field=filter_var($field, FILTER_SANITIZE_EMAIL); if(filter_var($field, FILTER_VALIDATE_EMAIL)) { return TRUE; } else { return FALSE; } }if (isset($_REQUEST['email'])) { $mailcheck = spamcheck($_REQUEST['email']); if ($mailcheck==FALSE) { echo "Invalid input"; } else { $email = $_REQUEST['email']; $subject = "Booking Inquiry"; $message = $_REQUEST['message']; mail("paulm@gmail.com", "Subject: $subject", $message, "From: $email" ); echo "<div id='bold'>Thanks for your message; I will respond within 48 hours. I look forward to playing for you!</div>"; } }else { echo "<div id='inputArea'> <form method='post' action='index.php'> E-mail:<input name='email' type='text'/><br><br> Message:<br><br> <textarea name='message' rows='3' cols='41'> </textarea> <br><br> <div id='center'> <input id='submitbutton1' type='submit' value='Send'/></div> </form></div>"; }?>//Yahoo UI Button below (this works...I need this).<script>var oSubmitButton1 = new YAHOO.widget.Button("submitbutton1", { value: "submitbutton1value" });</script> Thanks in advance for any direction. Edited May 9, 2010 by paulmo Link to comment Share on other sites More sharing options...
thescientist Posted May 9, 2010 Report Share Posted May 9, 2010 Have you tried rendering your page in sections. First just HTML/CSS, then added Javascript, finally adding PHP? There could be HTML errors which are preventing the page from displaying. Or are you saying its just the CSS? Either way, check piece by piece. Have you validated your HTML/CSS? Link to comment Share on other sites More sharing options...
paulmo Posted May 9, 2010 Author Report Share Posted May 9, 2010 (edited) Yes I've dissected the code in sections and validated script in Firebug. The problem seems to do with the inputArea script and my PHP form. The <div id='inputArea'> around my form doesn't seem to be calling the script. I have alternately changed 'name' to 'id' and that doesn't help. Thanks in advance for suggestions relating to the code provided. 600 views, someone's gotta know something. Edited May 10, 2010 by paulmo Link to comment Share on other sites More sharing options...
paulmo Posted May 11, 2010 Author Report Share Posted May 11, 2010 justsomeguy, you around tonight? Need your help here please. Link to comment Share on other sites More sharing options...
justsomeguy Posted May 11, 2010 Report Share Posted May 11, 2010 Inspect the fields in Firebug, check to make sure that everything has the correct classes and styles applied. 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