Forum Moderators: open
Just for mention, I'm programming at Dreamweaver
I'm programming a HTML website for a client,
and I'm at the time i need to create the contact form.
Except from the one-line areas (input text) i have multi-area (Textarea).
When I'm putting the textarea inside my form, it's looks OK.
When I'm checking it on a browser (And i tested it on Safari, Firefox and Opera),
It looks horrible! it's too big and getting over things...
It makes the site look like #*$!.
Maybe the fact I'm using "RTL" div it's influencing on the textare?
-The Docotype is HTML 4.01 Transitional
I'm sorry about the poor English.
I'm just a young boy from Israel (:
Include the complete DTD that you are using.
Don't use Dreamweaver, so can't speak to "RTL". Someone else will though. (A quick search suggests 'right to left', so I would not think so.
<form name="form1" method="post" action="">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><label for="Name">Name:</label></td>
<td><input type="text" name="Name" id="Name"></td>
</tr>
<tr>
<td><label for="Email">Email:</label></td>
<td><input type="text" name="Email" id="Email"></td>
</tr>
<tr>
<td><label for="Phone">Phone:</label></td>
<td><input type="text" name="Phone" id="Phone"></td>
</tr>
<tr>
<td><label for="Content">Message:</label></td>
<td><textarea name="Content" id="Content" cols="45" rows="5"></textarea></td>
</tr>
<tr>
<td> </td>
<td>Areas with (*) are required!</td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
</form>
And i didn't understood why shouldn't use Dreamweaver...
(Actually have a current version here, included as part of my Abobe Suite. Just not an app that I use.)
It looks horrible! it's too big and getting over things...
It makes the site look like #*$!.
By itself, the form (though plain as provided) looks fine in Firefox, Opera, and IE. So - the problem would seem to be with containers that are not behaving as you think they ought. I would continue to work the problem by adding background-color: to that and surrounding containers and see if they are sized and/or positioned as you think. Seeing what is in the container is not necessarily the same as knowing what space the container is actually claiming.
As far as .....it's too big' I would be suspicious of nested <div>, and the CSS. If you have a <div> with a font-size: 1.1em, and then put a <div> with a font-size: 1.4em; inside that, and so forth - nasty things can happen.
<edit>
You posted 'problem fixed' while I was making this post, so nevermind the above. Glad you got it worked out.
Take the lesson that the DTD is very important. When asking a question and posting a sample, include the full DTD. Most people don't, and that is a mistake. If a DTD is not provided, I am going to plug in the DTD of my choice to test the problem.
</edit>
i'm going nuts over this problem. i thought i would write it down as "simple problem", but is obviously ISN'T in my case. arrghh! :(
could somebody help me with this please?
the problem is it doesn't show right in IE6. the textbox for User ID is LONGER than that with password, though I have set size="18"!
what am I doing wrong?
i have this code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<TABLE width=255 align=CENTER CELLSPACING=0 CELLPADDING=0 id=infobox BORDER=0>
<form name=logInForm method=POST action=authurs.php>
<tr id=tblHdrLg height=25 class=xl1r1yt1b1><td colspan=2 align=center>Please LOGIN</td></tr>
<tr><td colspan=2 align=center> </td></tr>
<TR>
<TD valign=center width=100 class=leftNavLbl align=right>User ID</TD>
<TD valign=center width=155><INPUT type="TEXT" name="usrId" value="" maxlength="20" size="18"></TD>
</TR>
<TR>
<TD valign=center width=100 class=leftNavLbl align=right>Password</TD>
<TD valign=center width=155><INPUT type="PASSWORD" name="gpas" value="" maxlength="20" size="18"></TD>
</TR>
<tr><td colspan=2 align=center> </td></tr>
<TR>
<TD VALIGN="top"> </TD>
<TD ALIGN="CENTER">
<INPUT TYPE="submit" name="submit" STYLE="width: .605in; height: 0.275in" VALUE="Log In" CLASS="button">
<INPUT TYPE="reset" name="reset" STYLE="width: .605in; height: 0.275in" VALUE="Reset" CLASS="button"><br><br>
<input type=hidden id=TRUE name=logd1 value=usrLogdIn>
</TD>
</TR>
</form>
WHAT DID I DO WRONG? :(
Apply CSS styles to your form elements to get them to line up correctly:
.med-text {
width: 200px;
/* or 6em, or other valid sizes */
}
<input type="text" class="med-text" name="u" id="u">
<input type="password" class="med-text" name="p" id="p">