Button turns blue on press (not outline, not select highlight)

WhiteHox

I have a button that turn blue when the user holds on to it for a while sample below on mobile. Sample below

enter image description here

This not an issue with ::selected or outline has i have added that and it didn't work.

The whole button turns blue for a few seconds and disappears. How do i stop the button from turning blue?

Ritika Gupta

As I could infer from your problem statement, the background-color of your button might be changing due to :active pseudo-class acting on it which stays for few seconds of click on button and then when click is released it disappears. You may target the button:active selector and override the behavior with the desired background-color and color. I have tried creating a mock of what may help you.

button{
background-color: blue;
color: #ffffff;
height: 32px;
}
/* scenario you might need to override with the background color you want to retain */
button:active{
background: darkblue;
}
<button type="submit">Trial</button>

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

Blue highlight around button

Weird blue outline/border search button iOS

Ionic 6 - Issues with button press in blue

How to remove border highlight on an <select> after press it

Change the position of blue highlight on select box dropdown

How to disable the select highlight (blue) in datagridview

How to remove blue outline of select option in Twitter Bootstrap

Remove blue outline from Select box React Material UI

How do you highlight a tkinter button blue on MacOS

how to remove blue highlight on hover in select, option inputs html for chrome

I am trying to make a button where if you click it it turns purple, button was originally blue, but if clicked again then it turn back to blue

How to make whenever i press button it turns from transparent to white and press again to turn it back from white to transparent?

How to remove Firefox's button outline when mouse press, not click, hover or forcus

HTML button becomes "selected" with little blue outline after it is clicked which is not needed to be

Remove highlight on press in tablayout

How to change outline color of Material UI Select component (in outlined mode) when dropdown is opened ( currently it is blue )

How do I customize Material UI components (e.g. removing blue outline on Select component)?

Blue outline around active image

react-router+antD/ How to highlight a menu item when press back/forward button?

How to highlight elements in JavaScript one at a time on button press and stop at random element

Select next / previous Kivy RecycleView row on button press

Highlight to select and Middle-button to paste in jupyter notebook?

Select a row (highlight) from html table and send values onclick of a button

select and highlight the next word from QTextEdit on button click and show in QLabel

The default blue highlight removal for select control not working in high contrast mode in IE11

A blue highlight on dropdown box when select any value in windows phone 8

How to hide button outline

How to blur the outline of button?

JFrame turns blue when adding tabs