I am currently working on a large form, but I am encountering a major issue with it.
In certain sections of the form, only the last input field seems to be functional.
For example:
[...]
<div class="main_data">
<span class="info">main data</span><br>
<input type="text" name="name" placeholder="Name" required>
<input type="email" name="email" placeholder="Email" required>
<input type="text" name="website" placeholder="Website" required>
<input type="text" name="telephone" placeholder="Telephone" required>
<input type="text" name="address" placeholder="Address" required>
<input type="text" name="city" placeholder="City" required>
<input type="text" name="country" placeholder="Country" required>
</div>
[...]
All input fields appear to be unresponsive, and I can only enter text in the "Country" field.
A similar issue is occurring in other parts of the form, such as here:
[...]
<div class="detailed_info">
<span class="info">detailed info</span>
<input type="text" name="activity_areas" placeholder="Activity Areas" required>
<input type="text" name="company_valences" placeholder="Description of Company Valences" required>
<input type="text" name="where_operates" placeholder="Markets / Countries where it operates" required>
<input type="text" name="where_operates" placeholder="Annual Turnover (Value EUR)" required>
[...]
I am only able to input text in the "Annual Turnover" field.
I have attempted adjusting z-index values to troubleshoot, but have not identified any issues.
Below is the CSS for the first section; resolving the issue in this section may help address the problem in the second section.
.main_data{
width: 100%;
padding: 30px 0;
background: rgba(238, 238, 238, 0.9);
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
text-align: center;
}
.main_data .info{
display: block;
width: 100%;
margin: 0 0 10px 0;
font-size: 20px;
font-family: 'Futura-Light-Italic', sans-serif;
}
.main_data input{
border: 0;
padding: 5px 0;
margin: 0;
width: 80%;
background: #FFF;
color: #000;
text-align: center;
font-family: 'Futura', sans-serif;
}
.main_data input:focus{
border: 0;
}
If you would like to inspect elements on the page, you can access the form by clicking "Join the City as One of Us" here: link
Your assistance is greatly appreciated as this form needs to be operational today.
Please do not hesitate to ask if anything is unclear. I will do my best to assist you in helping me.
EDIT: I am using Google Chrome.