HTML, CSS and anything else that deals with client side capabilities.
Moderator: General Moderators
camarosource
Forum Commoner
Posts: 77 Joined: Sat Aug 03, 2002 10:43 pm
Post
by camarosource » Sun Jan 04, 2009 2:44 am
How to stop forms from ruining page layout??
I am writing a website with a form in the webpage. The layout it fit snuggly with the fields looking PERFECT in frontpage Design mode (WYSIWYG). However when I view the page any browser, the form has suddenly destroyed the page layout cause it's mysteriously added like 2 or 3 lines in height.
Experimenting, if I just have the fields it's perfect. However add the line
Code: Select all
<form action="http://www.camarosource.ca/forums/ucp.php?mode=login" method="post">
And it ruins the layout.
How do I make it so the form isn't creating that extra height?
camarosource
Forum Commoner
Posts: 77 Joined: Sat Aug 03, 2002 10:43 pm
Post
by camarosource » Sun Jan 04, 2009 2:59 am
Code: Select all
<html>
<head>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0" bordercolor="#FFFF00">
<tr>
<td valign="top" rowspan="3">
<img src="/images/layout_22.jpg" width="255" height="79" alt="" border="0"></td>
<td valign="top">
<img src="/images/layout_23.jpg" width="468" height="9" alt=""></td>
<td rowspan="3">
<img src="/images/layout_24.jpg" width="139" height="79" alt=""></td>
<td rowspan="3">
<table border="0" width="100%" cellspacing="0" cellpadding="0" bordercolor="#0000FF">
<tr>
<td colspan="2">
<img border="0" src="/images/layout_25.jpg" width="141" height="16"></td>
</tr>
<tr>
<td background="/images/search_bkg.jpg">
<form action="http://www.camarosource.ca/forums/ucp.php?mode=login" method="post">
<input type="text" name="username" size="15" value="" tabindex="1"><br>
<input type="password" name="password" size="15" tabindex="2"></td>
<td>
<img border="0" src="/images/layout_28.jpg" width="25" height="48"></td>
</tr>
<tr>
<td colspan="2">
<table border="0" width="141" cellspacing="0" cellpadding="0" bordercolor="#00FF00">
<tr>
<td width="25">
<input type="image" name="login" src="/images/layout_30.jpg"></td>
<td width="110">
<img border="0" src="/images/layout_31.jpg" width="69" height="15"></td>
</tr>
</table>
</form>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top">
<img src="/images/layout_26.jpg" width="468" height="59" alt=""></td>
</tr>
<tr>
<td valign="top">
<img src="/images/layout_32.jpg" width="468" height="11" alt=""></td>
</tr>
</table>
</body>
</html>
Schneider707
Forum Newbie
Posts: 9 Joined: Mon Dec 29, 2008 10:53 am
Post
by Schneider707 » Mon Jan 05, 2009 3:17 pm
do you have a live example we could see? I bet a little css would fix that right up.
If you can't put a live example up, then add this to a css file anywhere.
Syntac
Forum Contributor
Posts: 327 Joined: Sun Sep 14, 2008 7:59 pm
Post
by Syntac » Mon Jan 05, 2009 4:22 pm
Try adding a closing tag...
pickle
Briney Mod
Posts: 6445 Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:
Post
by pickle » Mon Jan 05, 2009 4:39 pm
Forms might also have some margins. I usually do this for my forms:
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.