Jump to content

PHP E-mail Form CSS Styling Help.


paulmo
 Share

Recommended Posts

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 by paulmo
Link to comment
Share on other sites

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

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 by paulmo
Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...