Shortcodes Ultimate DIV color

1
votes

I use Wordpress and Shortcodes Ultimate, and I'm currently using a shortcode named "service". It displays a text, with a title and an icon.

My purpose is to change the background color and the text color when the mouse is over the service area. I analyzed the HTML code of my page and found that there were two DIV elements for the "service" shortcode : su-service-title, su-service-content.

So, in my CSS file I wrote :

.su-service-content:hover, .su-service-title:hover{
    background-color: #2680BE;
    color: white;
}

The background correctly displays in both title and content elements, but the white text only displays properly in the title : the content text color does not change. The style title used for the content text is h3.

Here is the page I'm working on : http://www.cirnu.com/agence-web-corse/

Thank you for you help

2
htmlcsswordpressshortcode

2 Answers

1
votes

In the css of your template there is already a general styling rule for the color of h3. You should rather specify your selector a bit more in order to overrride this:

.su-service-content:hover h3, .su-service-title:hover {
    background-color: #2680BE;
    color: white;
}
0
votes

You could try to do it inline as well, just like regular html

<h3 style="color:white;">text</h3>

It works for other shortcodes, same plugin