Sat, 2003-04-12 11:23
Hi!
I made a Form and I want it to look like this: click
This is the code:
<html> <body> <style type="text/css"> table { color: #000000; font-family: Verdana; font-size: 10pt; } </style> <table width="250"> <tr> <td width="10"><span style="white-space: nowrap;">Real Name:</span></td> <td><input name="realName" id="realName" style="width: 100%;"></td> </tr> </table> <table width="250"> <tr> <td width="10"><span style="white-space: nowrap;">Email:</span></td> <td><input name="realName" id="realName" style="width: 100%;"></td> </tr> </table> <table width="250"> <tr> <td width="10"><span style="white-space: nowrap;">Location:</span></td> <td><input name="realName" id="realName" style="width: 100%;"></td> </tr> </table> </body> </html>
Now the problem is: Can I do that in pure Css? You see, I need lots of tables to align the form labels and elements the way they are.
I tried it with CSS but it doesnt work: click
<html> <form> <style> .myForm { background: #CCCCCC; padding: 5px; width: 400px; max-width: 300px; white-space: nowrap; } </style> <span class="myForm">Real Name: <input name="realName" style="width: 100%;"></span><br> <span class="myForm">email: <input name="email" style="width: 100%;"></span><br> </form> </html>
thanks, I appreciate it
- Robert
Sat, 2003-04-12 13:42
#1
Form without Tables?
Suprisingly, this works:
<div class="myForm"> <span style="float: left;">Real Name:</span> <input name="realName" style="width: 100%;"> </div> <div class="myForm"> <span style="float: left;">email:</span> <input name="email" style="width: 100%;"> </div>
Was playing around, basically when you set the width of the input to 100%, it takes 100% of the width of the containing box. Unless there's a float there.
Learn something every day!
Sat, 2003-04-12 13:56
#2
Form without Tables?
Wow, thank you very much. You saved me hell alot of work.
I'm doing this for a Smashing Pumkins side. The Smashing Pumpkins Fan Database ( http://www.spfd.org )
If I put a credits page up, you'll be on it. Thank you \:D/