Text isn't aligning with an object correctly in html

Question

So I'm trying to make a form with a message box, but it won't align correctly; it keeps pushing the text to the bottom of the area it takes up.. I've accepted putting in a break between the text field and the message field for a long time, but there's a break, so it isn't aligned there either...

JSFiddle: http://jsfiddle.net/2U2PJ/

    <form action="sending.php" method="post" name="Contact Form" id="form1" onsubmit="MM_validateForm('Name','','R','E-mail','','R','Device','','R','Message','','R')return document.MM_returnValue" encytype="text/plain">
                            <p>
                                <label><font size="3">Name: </font>
                                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input name="Name" type="text" id="Name" size="25" /><font size="2"> <font color="red"><span id="req_3" class="req">*</span></font></font></label>
                            </p>
                            <p>
                                <label><font size="3">Email:</font>
                                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input name="E-mail" type="text" id="E-mail" size="25" /> <font size="2"><font color="red"><span id="req_3" class="req">*</span></font></font></label>
                            </p>
                            <p>
                                <label><font size="3">Review:</font>
                                &nbsp;&nbsp;&nbsp;&nbsp;<textarea name="Message" cols="35" rows="7" id="Message" placeholder="Y U SO BROKE MR. THINGY D;"></textarea>
                            </p>
                                </label>
                            <label>
                                <input name="Submit" type="submit" id="Submit" value="Submit" />
                            </label>
                        </form>

Answer 1

As per my comment. Use CSS. This should get you on the correct path:

http://jsfiddle.net/2U2PJ/3/

css:

.contact-form .field label { width: 100px; display:inline-block; vertical-align: top; }
.contact-form .req { color: red; }
.contact-form .field .textbox { width: 180px; }

html:

<div class="contact-form">
<form action="sending.php" method="post" name="Contact Form" id="form1" onsubmit="MM_validateForm('Name','','R','Email','','R','Device','','R','Message','','R')return document.MM_returnValue" encytype="text/plain">
    <div class="field">
        <label for="Name">Name:</label>
        <input name="Name" type="text" id="Name" class="textbox" />
        <span id="req_3" class="req">*</span>
    </div>
    <div class="field">
        <label for="Email">Email:</label>
        <input name="Email" type="text" id="Email" class="textbox" />
        <span id="req_3" class="req">*</span>
    </div>
    <div class="field">
        <label for="Message">Review:</label>
        <textarea name="Message" cols="35" rows="7" id="Message" placeholder="Y U SO BROKE MR. THINGY D;"></textarea>
    </div>
    <div>
        <input name="Submit" type="submit" id="Submit" value="Submit" />
    </div>
</form>
</div>

Answer 2

Full Code to simplify your issue!

http://jsfiddle.net/SinisterSystems/jLXsV/2/

HTML:

<form action="sending.php" method="post" name="Contact Form" id="form1" onsubmit="MM_validateForm('Name','','R','E-mail','','R','Device','','R','Message','','R')return document.MM_returnValue" encytype="text/plain">
    <p>
    <label>Name:</label>
        <input type="text" />
    </p>

    <p>
    <label>Email:</label>
        <input type="text" />
    </p>

    <p>
    <label>Review:</label>
        <textarea rows="7" cols="35"></textarea>
    </p>

    <p>
    <input name="Submit" type="submit" id="Submit" value="Submit" />
    </p>

CSS:

input, textarea {
    width:200px;
    margin-left:15px;
}
label {
    float:left;
    min-width:100px;
}

With your IDs

Fiddle: http://jsfiddle.net/SinisterSystems/jLXsV/3/