CODEWITHSUNDEEP
html
That-Kickass-GirL
That-Kickass-GirL

Reputation: 43

HTML form not taking inputs

The form is displayed on the browser, but when I roll my cursor over the text fields, it just doesn't take the input. How is this caused and how can I solve it?

    <html>
        <head>
            <title>Chemicals.ltd</title>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width">
        </head>
    <body>
      <!--> <div style='position:absolute;z-index:0;left:0;top:0;width:100%;height:100%'>
  <img src='C:\Users\Dell\Downloads\chem.jpg' style='width:100%;height:100%' alt='[]' />
</div><!-->
        <h2> Welcome to TOXIC TRADERS ! </h2>
        <p>We trade chemicals , for industrial or lab use.<br> Please enter Relevant info in the form </p>

        <form name="Details" action="/ChemControl" method="POST">
        Chemical Name: <input type="text" name="Chemical"><br>
        Hazard Level(No.): <input type="text" name="Hazard type"><br>
        Lab/Company Name: <input type="text" name="Lab Name" ><br>
        Serial No.: <input type="text" name="Serial No."><br>
        <input type="submit" value="Send Info">
        </form>      

    </body>
</html>

Upvotes: 2

Views: 5517

Answers (4)

Derzu
Derzu

Reputation: 7146

Your font size is probably set to zero.

Add this to your css style file:

input {
   font-size: 10pt;
}

Or add the style directly on the HTML tag:

<input style="font-size: 10pt;" type="submit" value="Send Info">

Upvotes: 0

charlietfl
charlietfl

Reputation: 171679

Your html comments are invalid

should be

<!-- <html not displayed> -->

Not

<!--> <html not displayed> <!-->

Result is the html that it appears you are trying to comment out is masking the form

Upvotes: 3

user3024816
user3024816

Reputation: 81

Your div tag with 100% height and 100% width has covered the entire view port like a modal form, hence the area beneath it has become non-clickable. Remove the height and width from tag like below:

<div style='position:absolute;z-index:0;left:0;top:0;'>
  <img src='C:\Users\Dell\Downloads\chem.jpg' style='width:100%;height:100%' alt='[]' />
</div>

Upvotes: 0

Udo Klimaschewski
Udo Klimaschewski

Reputation: 5315

You are overlaying your form with a div, that blocks the input. Remove it:

<html>
    <head>
        <title>Chemicals.ltd</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
    </head>
<body>
    <h2> Welcome to TOXIC TRADERS ! </h2>
    <p>We trade chemicals , for industrial or lab use.<br> Please enter Relevant info in the form </p>

    <form name="Details" action="/ChemControl" method="POST">
    Chemical Name: <input type="text" name="Chemical"><br>
    Hazard Level(No.): <input type="text" name="Hazard type"><br>
    Lab/Company Name: <input type="text" name="Lab Name" ><br>
    Serial No.: <input type="text" name="Serial No."><br>
    <input type="submit" value="Send Info">
    </form>      

</body>

Upvotes: 2

Related Questions