Disable highlight with CSS

Good day SO. I would like to disable highlighting on my disabled input text fields. I found a working answer on this SO Answer and tried to implement on my code. However, it does not work on my end. I don't know what I am doing wrong.

input[type="text"]:disabled {    background-color: red;    -webkit-touch-callout: none;    /* iOS Safari */    -webkit-user-select: none;    /* Safari */    -khtml-user-select: none;    /* Konqueror HTML */    -moz-user-select: none;    /* Old versions of Firefox */    -ms-user-select: none;    /* Internet Explorer/Edge */    user-select: none;    /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */  }

<input type="text" class="someclass" value="some value that is very long long long" disabled="disabled">

Note. I also added background-color to check if selector is correct and it does change color.

The reason why I want to do this is the text value is longer than the text itself, there is a ellipsis at another class with this. If I double click on the text and slide to the right, the text vanishes.

https://stackoverflow.com/questions/66881006/disable-highlight-with-css March 31, 2021 at 10:54AM