Dedi Thorne asked 6 months ago
As can be seen in the two attached screenshots, my phone number is hiding partway under the country flag.
I need to figure out How to move my placeholder text over for the phone field. I've tried adding padding to several classes I've found in the Inspect element, but so far nothing seems to be working. Anyone know what class I need to add padding to here? Or Margin if that would work better?
Thank you!
Victor Font Staff answered 6 months ago
Do you know how to use your browser inspection tool? Use the tool to find the correct CSS and adjust it. There's very likely a CSS conflict happening between Formidable and your theme or another plugin that is overriding Formidable's CSS.
Dedi Thorne answered 6 months ago
Updating this in case someone else should run into the issue. My problem seems to have stemmed from trying various classes in this css. When I just used the entire set, the padding was fixed. I was also forced to use that annoying !important declaration on the first two lines because something was determined to override them..iti--allow-dropdown input.iti__tel-input, .iti--allow-dropdown input.iti__tel-input[type=tel], .iti--allow-dropdown input.iti__tel-input[type=text], .iti--show-selected-dial-code input.iti__tel-input, .iti--show-selected-dial-code input.iti__tel-input[type=tel], .iti--show-selected-dial-code input.iti__tel-input[type=text] {
padding-right: var(--iti-input-padding) !important;
padding-left: var(--iti-selected-country-arrow-padding) !important;
margin-left: 0;
}
Please login or Register to submit your answer
