"Currently, there seems to be an issue with the alignment of the Input>Select Form Field placeholder

In the midst of constructing a form using Hubspot's built-in form developer, I encountered an issue with aligning the placeholder text within each field to the center. While this adjustment was successful for all the text input fields, it proved ineffective on the Select drop down when accessed from IOS mobile devices (specifically tested on Safari, Chrome, and Edge for IOS). Interestingly, the alignment appeared to function properly on Android devices.

https://i.sstatic.net/GIUZy.png

Despite attempting various CSS techniques such as

text-align:center

I experimented with applying styling to elements including input, option, select[id="idstring]::placeholder, ::placeholder, ::-webkit-input-placeholder, :-ms-input-placeholder, input::-moz-placeholder, and several others.

The challenge remains unsolved as I struggle to achieve the desired center alignment for the placeholder text."

htmlcssiosformsinput

Answer №1

Have you tested your scenario using Safari Technology Preview? If the issue persists, please consider reporting it on bugs.webkit.org.

Providing a separate test case to demonstrate this bug on WebKit's bug tracker would greatly assist in solving the problem.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Looking for a Haar Cascade specifically designed for detecting lips

I am in need of a Haar cascade file specifically for lip detection. Despite my efforts to search in openCV, I have not been successful in finding one. While I visited the link , I could not locate a Haar cascade file tailored for lip detection only. If a ...

pythoniosc#-4.0opencvface-detection

How to Retrieve the Value of a Radio Button with JavaScript

Issue: Difficulty in retrieving the value of a radio button or text box input. Through trial and error, I managed to access the information within the div gender1. I struggled to extract the values of gender or age. Despite attempting methods like append ...

javascripthtmlradio-button

Creating a JavaScript popup script from scratch

I'm looking to create a script using only JavaScript that will display a popup when the page loads. The background should be faded and I want to include custom content in the popup. I don't want to utilize CSS or HTML directly. Embed the CSS ...

javascriptcsspopup

Instructions on creating a non-editable text area where only copying and pasting is allowed

I am looking to simply copy and paste content into a textarea without needing to make any edits within the field. <form action="save.php" method="post"> <h3>Text:</h3> <textarea name="text" rows="4" cols="50"></textarea ...

javascriptjqueryhtmlcss

A unique custom class called "Interactive ViewBuilder" that features a specially designed storyboard, seamless

I have successfully implemented a custom subclass of UISegmentControl in my project. #import <UIKit/UIKit.h> @interface MMcustomsegment : UISegmentedControl @end After setting the correct custom class in the identity inspector on the storyboard, ...

iosstoryboarduistoryboarduisegmentedcontroluistepper

Unable to get spacing correct on loading page

My attempt at creating a loading page using CSS and HTML has hit a roadblock. I'm trying to show a loading bar that ranges from 0% to 100%. Despite my use of justify-content: space-between, I can't seem to get it right. I've searched through ...

javascripthtmlcsssass

Objective-C: Trouble with table cell visibility in table view

I am facing an issue with my tableviewcontroller class that is connected to a navigation controller. For some reason, when I run the code, the cells do not appear on the screen. Instead, I only see a navigation bar with a tab bar. Below is the snippet of ...

objective-ciosstoryboard

I made some adjustments to the program, but I'm having trouble identifying the issue

Here's a simple form I'm using to input and send the category name: <form action="insertexp.php" method="post"> Category Name: <input type="text" name="name"><br> <input type="submit"> </form> This is my PHP script ...

phphtmlmysqlsql

How to extract the values from multiple checkboxes in Angular version 10

app.component.html <form #x="ngForm" (ngSubmit)="submit()"> <div class="form-check form-check-inline"> <input [(ngModel)]="details.a" #a="ngModel" type="checkbox" va ...

angulartypescriptformscheckboxangular-reactive-forms

Ways to eliminate the white overlay that occurs on the page after clicking the scroll top button

Hi there! I've been busy with updating my site at , and noticed a small glitch. Every time I hit the Back to Top button at the bottom of the page, the screen goes white. Any ideas on how to fix this issue? Thanks in advance! ...

javascripthtmlcsswordpresswordpress-theming

Creating a smooth image transition effect using CSS

I have successfully implemented a code that allows for crossfading between images when the mouse hovers over them. Now, I am looking to modify the behavior so that the crossfade effect happens only once when the mouse passes over the image. In other words ...

htmlcssfading

Permit users to access downloads upon authorization

Hey there, just a quick question. I'm in the process of building a website that stores files and allows users to purchase and download them. The issue I'm facing is that the file directory is protected with .htaccess permissions to prevent unauth ...

phphtmlsecurityauthenticationweb

What is the best way to adjust the CSS height of an HTML select element to 100% within a table cell in Internet Explorer

Is it possible to make a select (dropdown list) element fill out 100% of the table cell height? I was successful in getting it to work in Firefox and Chrome, but unfortunately not in IE (Internet Explorer). Here is the test HTML code: <table> & ...

htmlcssinternet-explorer

JQuery script is malfunctioning

My community website is set up as shown below: <div id="posts"> <div class="container"> <div id="placeholder"></div> <h1>Friend Requests</h1> </div> </div> getRequests.js appends the ...

javascriptphpjqueryhtmlajax

Is there a way to transform a JSON document into an HTML webpage using Ruby on Rails?

Currently, I am developing a website that is capable of receiving a URL get parameter pointing to a JSON file and transforming it into a visually appealing HTML page (not in table format). To achieve this, I need to create a recursive function for parsin ...

htmlruby-on-railsjsonruby

Struggling to send data to child components in Vue: Received an object instead of the expected string value of "[object Object]"

My goal is to create a basic To-Do app where, upon clicking the button <b-button v-on:click="newItem" pill variant="primary">Add</b-button>, the input text is displayed below. To achieve this, I am using v-model in the input field (located in ...

javascripthtmlvue.js

How to Get Rid of the Padding on an HTML Dropdown List

How do I eliminate the padding on the top/left side of a select menu? https://i.sstatic.net/N1mS2.png I attempted to set the padding and margin to 0 but it did not make any difference. Below is the HTML code: <form class="timePeriodMenu"> < ...

htmlcssgoogle-chrome

Having difficulty with Selenium - inputting credentials for login

Below is the code snippet I am currently using: from selenium import webdriver from selenium.webdriver.common.keys import Keys driver = webdriver.Chrome() driver.get("http://website.com") element_user = driver.find_elements_by_id("user").send_keys("name ...

pythonhtmlselenium

When the cursor hovers over an item, I would like to enlarge its width while simultaneously shrinking the width of two additional items

Here is a section that I have created, you can view the mockup here. The section is divided into 3 parts, each taking up around 33.3% of the width and floated. My goal is to make it so that when a specific element, like .col-one in my example, is hovered ...

csssass

Obtaining user input in the form of a string and displaying

Having difficulty with my mastermind program due to user input issues. The program is designed to accept a string input from the user for guessing purposes, but I keep encountering errors when trying to display it. Here's the specific section that&apo ...

cstringinput