<div class="form-group row pswrd" style="padding: 0px 10px">
<div id="email" class="col-md-12 col-xs-12">
<input type="password" class="form-control c_fname" id="c" #pswd name="password" placeholder="password" [(ngModel)]="user.password" ngModel required>
</div>
</div>
There seems to be an issue with the password input field not being clickable on mobile devices within this website:
Could anyone provide any insights into what might be causing this problem?
You are encountering a positioning issue where the:
div class="col-lg-12 col-xs-12"...
The remember me and forgot password? options are positioned above the password input field...
If the position is not set to relative, you may have trouble accessing the password input field.
I actually came across your website link while testing the mobile view using Google Chrome dev tools. In the mobile version, I noticed that the login pane below was overlapping with the password field, making it difficult to click. Here is a screenshot for reference:
https://i.stack.imgur.com/TMxkG.png
It seems like the issue lies in the CSS code, specifically the height of the hover div. Adjusting this should resolve the problem.
Here is a helpful solution to your issue, just follow these steps:
Eliminate the max-height property from the #loginalign element to prevent overlap of the password field and the remember me section on smaller devices.
Add the class mb-0 to the password field to eliminate unnecessary space below the fields.
To get rid of the space between the login button and the Remember me option on small devices, remove the margin-top property from the .login_1 class within the
@media (max-width: 768px) and (min-width: 320px)I'm having an issue with the blur effect on my background image. Although it works well, my tooltips also end up being blurred behind the divs: https://i.stack.imgur.com/BMdh4.png Is there a way to ensure that my tooltips stay on top of the subseque ...
Is there a smarter person out there who can help me understand why the slimMenu is breaking when I add these files to the bottom of the page? <link href="includes/templates/westminster_new/css/age-verification.css" rel="stylesheet"> <script src=" ...
Currently, I am utilizing Ionic 3 for my project. The location of the images file is \src\assets\img. This pertains to a basic page implementation. export class BasicPage { items = []; constructor(public nav: NavController ,private adm ...
I have been working on a project where I gather array elements from user input and try to display them in an HTML table. Unfortunately, the event listener seems to not be triggering, and I can't figure out why. Here is the relevant HTML code: ...
I have three elements named one, two, and three, declared as seen below: <div id =container> <div id 'one' class="element one"></div> <div id 'two' class="element two"></div> < ...
I've been attempting to include an additional div, but it consistently appears as the second row.. I want all of them to be on the same row and aligned with each other. Here is the HTML code: <div class="content-grids"> <div clas ...
I am trying to set authentication headers for images called from an image tag (<img>). To achieve this, I have created a custom pipe named secureimages using the command ionic g pipe secureimages. This pipe intercepts the HTTP requests in an interce ...
After successfully building my project using CodeIgniter on localhost, I encountered an issue when trying to run it on a webhost. The site was functional but the design elements such as scripts and stylesheets were not loading properly. Before uploading t ...
Looking for a solution to ensure Content 3 appears below Content 2 in this block of HTML. Content 1 is extensive and extends far down the page. <table> <tr> <td>(Content 1)</td> <td>(Content 2)</td> ...
Seeking help for adjusting font-size across a responsive web page design using different font families. font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif; To achieve responsiveness, various media queries were applie ...
Recently, I delved into the world of CSS animation and encountered a frustrating issue. I've tried numerous methods and workarounds to achieve a smoothly looping animation without interruptions. Despite my efforts, I have not been able to replicate th ...
Trying to understand the process of dynamically adding routes from a lazy-loaded module. The core app has initial routes: export const routes = [{ path: "", component: HomeComponent }, { path: "moduleA", loadChildren: "app/moduleA/A.module ...
I am looking for a way to create a simple REST API using a hosting site that only allows hosting of HTML files along with JavaScript files. I want to be able to send POST/GET requests and receive JSON data in response. For instance, when making a GET requ ...
After reviewing UIkit, as well as some other jQuery Context Menu plugins, I have noticed that they all tend to exhibit a similar behavior: The actual menu div renders outside the window, causing valuable content to be hidden from view. Is there a way to ...
In my Angular application, I have successfully implemented a versatile tooltip feature that goes beyond just displaying text. The tooltip is a div element that has the ability to contain various contents: .tooltip-master { position: relative; .tooltip ...
I am currently utilizing freemarker to dynamically generate HTML pages based on user requests. These pages contain a reference to a javascript file in the header section. Within this javascript file, there is an array that is defined. It is necessary for m ...
Recently, I got an Angular template from this site: After successfully running npm install, I encountered an error when trying to run ng serve: ./src/styles.scss - Error: Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js): Mo ...
I am working on setting up a 2-column HTML form using CSS grid. In the first column, I have labels placed on individual rows. In the second column, I have form elements also placed on individual rows. This is my initial attempt at this task and I am sti ...
We are currently working on an internal web application and need to find a way to upload a very large file (100mb). Can an HTML file upload handle this size or do we need to consider other options like Java applets, Silverlight, or Flash? Is it even feasi ...
I have successfully implemented JavaScript code to dynamically update the value of an input tag in my popup. However, when I try to echo out this updated value using a PHP variable within the same popup, it doesn't seem to work as expected. Despite un ...