Kevin Kevin - 1 year ago 78
CSS Question

CSS background image using :after only shows when on hover

I have an anchor element with the class

and the following CSS (SASS):

.et_button_no_icon .et_pb_button {

&:after {
display: inline-block;
position: absolute;
margin-left: 30px;
content: "";
background: url("images/boton_rojo.png");
width: 28px;
height: 27px;
margin-top: 2px;

The problem is that the image only shows on hover. See the link here: (the anchor is Nuestras Empresas, below the first parragraph).

I would like to display the image in normal and on hover.

Answer Source

In your .et_pb_button:after there is a opacity: 0; and I found a .et_pb_button:after display: none in your css style. Sadly you haven't uploaded your source maps so I cant see on which line this is. But disabling the display:none, and disabling the opacity: 0; did the trick for me.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download