Chrome Autofill CSS in classic 5.1

This forum allows users to post and respond to "How Do I Do ....." questions. The information contained in this forum has not been validated by K-Rise Systems and, as such, K-Rise Systems cannot guarantee the accuracy of the information.
Posts: 29
Joined: September 8th, 2021, 2:59 pm

Chrome Autofill CSS in classic 5.1

Unread post by btyrell »

In classic 5.1 default CSS, the textbox titles will cover the contents of the textbox if they are filled in via Chrome autofill. The title will stay like this until the page is interacted with.
Screenshot 2022-04-05 151547.png
To fix this, I added some lines to Default_Modern_Desktop.js in a ready() function which will parse all textboxes on the page for the internal autofill CSS property: ":-internal-autofill-selected". If this property is found, it will toggle the "field-active" class of the textbox which moves the title to its normal position. This can be used with textboxes with different styling on them, but the code will need to be changed to match the CSS classes that are used.

Code: Select all

setTimeout(() => {
	var textboxes = document.getElementsByClassName('text-field-wrap');
	for (var i=0; i<textboxes.length; i++) {
		if (textboxes[i].getElementsByTagName('input')[0].matches(':-internal-autofill-selected')) {
}, 500);
This solution isn't foolproof given the 500ms timeout, but it will work in most cases.
word count: 170

Post Reply