I find that my website get weird when I use Firefox open it, but it display well under IE8, the buttonesubmit is moved to bottomfooter, can anyone help me improve the code below. thank you.

<form action="contact.php" method="post" name="formplace" target="_blank" class="email" id="formplace" onsubmit="MM_validateForm('firstname','','R','lastname','','R','emailaddress','','NisEmail','comments','','R');return document.MM_returnValue">
      <p>pls contact us by following address:<br />
        <br />
    Guangzhou
      <p> You could also fill in below form and send it to us. we will get back to you as soon as possible.<br />
        <br />
        First Name: 
        &nbsp;&nbsp;&nbsp;
        <label for="firstname"></label>
        &nbsp;&nbsp;&nbsp;
        <input type="text" name="firstname" id="firstname" />
        <br />
        <br />
        Lsat Name:
        <label for="lastname"></label>
        &nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;
        <input type="text" name="lastname" id="lastname" />
        <br />
        <br />
        Email Address:
        &nbsp;&nbsp;
        <label for="emailaddress"></label>
        <input type="text" name="emailaddress" id="emailaddress" />
        <br />
        <br />
        Telephone:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <label for="telephone2"></label>
        <input type="text" name="telephone" id="telephone" />
        <label for="TEL"></label>
        <br />
        <br />
        Country:
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <label for="country"></label>
        <select name="country" id="country">
          <option>Australia</option>

          <option>Turkey</option>
          <option>Japan</option>
          <option>South Korea</option>
          <option>Vietnam</option>
          <option>other</option>
        </select>
        <br />
        <br />
        Business:
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <label for="business"></label>
        <select name="business" id="business">
          <option>wholesale</option>
          <option>retail</option>
          <option>industrial</option>
          <option>services</option>
          <option>distributor</option>
          <option>manufacturer</option>
          <option>importer</option>
          <option>other</option>
        </select>
        <label for="telephone"></label>
        <label for="FAX"></label>
        <br />
        <br />
        Comments:<br />
        <br />
        <label for="comments"></label>
        <textarea name="comments" id="comments" cols="45" rows="5"></textarea>
        <br />
        <br />
        &nbsp;&nbsp;&nbsp;      
        <input name="submit" type="submit" id="submit" onclick="MM_validateForm('firstname','','R','lastname','','R','emailaddress','','RisEmail','telephone','','NisNum','comments','','R');return document.MM_returnValue" value="Submit" />
        <br />
      </p>
      </form>

Dani AI

Generated

Quick diagnosis for : Firefox is exposing broken markup and fragile layout practices that IE8 happened to hide. The posted HTML contains nested/unfinished paragraph tags, empty <label> elements, and lots of &nbsp;/<br> spacing. That combination produces different flow in different engines. ’s absolute-position idea will force controls out of the normal flow (making selects render oddly); ’s advice to use stylesheets is right but needs to be paired with semantic markup, not inline absolute coordinates.

A clean, cross‑browser approach is to group each label+control, put label text inside the <label> or use for, and let CSS handle alignment. Example (replace the original form markup with a structure like this):

<form class="contact" action="contact.php" method="post">
  <div class="row">
    <label for="firstname">First name</label>
    <input id="firstname" name="firstname" type="text">
  </div>

  <div class="row">
    <label for="email">Email</label>
    <input id="email" name="email" type="email">
  </div>

  <div class="row">
    <label for="comments">Comments</label>
    <textarea id="comments" name="comments" rows="4"></textarea>
  </div>

  <div class="actions">
    <input type="submit" name="send" value="Send">
  </div>
</form>
.contact .row { display:flex; align-items:center; gap:10px; margin:0 0 0.6em; }
.contact label { width:120px; }
.contact input, .contact select, .contact textarea { flex:1; max-width:480px; }
.actions { margin-top:0.6em; }

Quick checklist/troubleshooting (apply in order):

  • Run the form through the W3C Markup Validator and fix unclosed/nested tags (especially stray <p>s).
  • Remove layout hacks (&nbsp;, <br> for alignment); use CSS for spacing.
  • Put visible text inside <label> or use for="id" so Firefox/assistive tech behave properly.
  • Avoid position:absolute for form fields; use flexbox/inline-block/floats.
  • Rename the submit button (e.g. name="send") so it doesn’t shadow form.submit used by Dreamweaver JS (MM_validateForm).
  • Use the browser inspector to see which element’s computed position or margin is pushing the button into the footer.

These steps will make the form consistent across Firefox, IE, and modern browsers while keeping validation and accessibility intact.

Recommended Answers

All 5 Replies

I would recommend you to use Style attribute on each field. With this you will have uniform in all browsers

eg:
<input type="text" name="firstname" id="firstname" Style="z-index: 105; left: 200px; position: absolute; top: 200px" />
<input type="text" name="lastname" id="lastname" Style="z-index: 105; left: 200px; position: absolute; top: 230px" />

Thanks
Khalid

No.Use must not use inline css.You must prefer separating the two.Create an external css style sheet .
An external style sheet is ideal when the style is applied to many pages.Each page must link to the style sheet using the <link> tag.

You may use internal css when the style is for a particular file.

Hello Thank you two, I prefer f2key method, but unfortunately, I don't fully understand the code, I have tried it by inserting it to the form area but the display is not what i expect, only a box displayed and there is no firstname displayed, in addition, when I try to use it for select items, like business, country, all the business items was displayed on the screen, there is no dropdown arrow for selection.

I know that my problem is basic and I only know some Dreamweavr methods, and don't know the code at all. so any one could take time to teach me

  • how to display lastname, firstname etc

  • Item Two: how to keep display text in the same line with box

  • Item Three; I don't know z-index:105 meaning, I delete it, or change it, the display is still same.

thanks if any one tell me detail.

From the above article and reply, I understand that it is importent to know the basic code. Any one can help me to understand please.

,
Google 'basic html tutorial' and 'basic css tutorial' All the info you need to
get stsrted is there. Just don't try to run before you can walk.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.