Form Style

[snike]

I hope this is in the right form.

I have this code:

<form action="login2.php" method="post">
<font face="Verdana" size="2">Username</font>:<input type="text" name="username" size="15" style="font-family: Verdana; color: #FFFFFF; font-size: 10pt; border: 1px solid #FFFFFF; background-color: #141F19" /><font face="Verdana" size="2"> Password:</font><input type="password" name="password" size="15" style="color: #FFFFFF; font-family: Verdana; font-size: 10pt; border: 1px solid #FFFFFF; background-color: #141F19" /> 
<input type="submit" value="Login" style="color: #FFFFFF; font-family: Verdana; font-size: 10pt; border: 1px solid #FFFFFF; background-color: #141F19" />
</form>

Does the size= and the style= a good idea? Does it work on all browsers or should I use CSS?

 

[cwnt]

It should work fine in all browsers. As for using CSS, the style="" bit is CSS.

 

[snike]

ok thanks!

 

[Shorty]

snike, you're using way too much code there, allow me to declutter it for you:

<style type="text/css">
.class1 {color: #FFFFFF; font-family: Verdana; font-size: 10pt; border: 1px solid #FFFFFF; background-color: #141F19}
</style>

<form action="login2.php" method="post">
<font face="Verdana" size="2">

Username:
<input type="text" name="username" size="15" class="class1" />

Password:
<input type="password" name="password" size="15" class="class1" /> 

<input type="submit" value="Login" class="class1" />

</form>

Now whenever you want to have an input box styled the same way, just put class=class1, along with the CSS of course, and you're sorted. Hope that helps and speeds your pages up a little bit.

 

[snike]

ok thanks shorty! that helped!

Any one know how to make the height of a text box smaller?
take a look at www.emeraldfeathers.com
you can see the log in form where it says EF Connect.
The backround of the cell table continues because of something. it shouldn't continue like that... i think it is like that because of the text boxes...can someone help..plz..

 

[Dan]

<textarea style="height: 50px;">stuff</textarea>

or

<textarea rows="4">stuff</textarea>

I think you can figure out what each one does..

 

[Kate]

For some form fields like <input type="text"> I advise you to use the maxlength tag too so you can limit the size of user input. For example if the matching db field allows 50 characters it would be a good idea to have maxlength="50" in the matching text box. And of course, always check user input before saving to the DB so as to avoid SQL injection attacks.