Title: Button :Focus colour same as :hover
Last modified: September 8, 2017

---

# Button :Focus colour same as :hover

 *  Resolved [harveyl12](https://wordpress.org/support/users/harveyl12/)
 * (@harveyl12)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/button-focus-colour-same-as-hover/)
 * So i have some buttons on my services on the page of hcldesign.co.uk which is
   my website I am developing.
 * I have these buttons changing colour on hover by using elementor page builder.
   I am wanting for all buttons on my site to be able to apply the hover colour 
   when the button is clicked.
 * I have made this possible per button by using the below code but as you can see
   i would have to find every button and change the button reference. Not ideal 
   and will be a lot of CSS in my additional CSS field.
 *     ```
       .elementor-130 .elementor-element.elementor-element-043fopq a.elementor-button:focus, .elementor-130 .elementor-element.elementor-element-043fopq .elementor-button:focus {
           color: #ffffff;
           background-color: #c335eb;
           border-color: #c335eb;
       }
       ```
   
 * So does anyone know anyway in which I can use CSS to apply the :hover colour 
   when a button is clicked such as :focus? So when a button is clicked it just 
   keeps the :hover effect active?
 * Thanks,
 * Harvey
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fbutton-focus-colour-same-as-hover%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 5 replies - 1 through 5 (of 5 total)

 *  [Jack](https://wordpress.org/support/users/jdabber/)
 * (@jdabber)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/button-focus-colour-same-as-hover/#post-9477838)
 * I think you’re looking for the :active selector:
 * [https://developer.mozilla.org/en-US/docs/Web/CSS/:active](https://developer.mozilla.org/en-US/docs/Web/CSS/:active)
 *  [Jacob Peattie](https://wordpress.org/support/users/jakept/)
 * (@jakept)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/button-focus-colour-same-as-hover/#post-9478221)
 * > So does anyone know anyway in which I can use CSS to apply the :hover colour
   > when a button is clicked such as :focus?
 * You need to provide the same styles for both `:hover` and `:focus` (or `:active`
   etc.), as you have done, to have them appear the same. There’s no way to say 
   that all `:focus`s should be the same as the `:hover` with vanilla CSS.
    -  This reply was modified 8 years, 9 months ago by [Jacob Peattie](https://wordpress.org/support/users/jakept/).
 *  Thread Starter [harveyl12](https://wordpress.org/support/users/harveyl12/)
 * (@harveyl12)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/button-focus-colour-same-as-hover/#post-9478519)
 * Hi,
 * SO are we saying that I need to add CSS for each individual button here and this
   is the only way? So to literally use the code i pasted but change the buttons
   handle until I have set this for all buttons i need to change?
 * Would this cause any speed issue here?
 * Thanks,
 * Harvey
 *  [Jacob Peattie](https://wordpress.org/support/users/jakept/)
 * (@jakept)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/button-focus-colour-same-as-hover/#post-9478555)
 * Since each button is a different colour, yeah you’ll need to do it for each button.
   There’s no speed issue.
 *  Thread Starter [harveyl12](https://wordpress.org/support/users/harveyl12/)
 * (@harveyl12)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/button-focus-colour-same-as-hover/#post-9479152)
 * Okay thank you

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Button :Focus colour same as :hover’ is closed to new replies.

## Tags

 * [button](https://wordpress.org/support/topic-tag/button/)
 * [clicked](https://wordpress.org/support/topic-tag/clicked/)
 * [color](https://wordpress.org/support/topic-tag/color/)
 * [css](https://wordpress.org/support/topic-tag/css/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 5 replies
 * 3 participants
 * Last reply from: [harveyl12](https://wordpress.org/support/users/harveyl12/)
 * Last activity: [8 years, 9 months ago](https://wordpress.org/support/topic/button-focus-colour-same-as-hover/#post-9479152)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics