Add a image using Href Id , using CSS

Question

I am working on a wordpress website ,

Where i need to add a image before Hyper link , but i am failed to do so.

I have this for href , and i need image above these links

but i am failed , so far i tried to write css is

 background: url("outline.png") no-repeat 6px center;
  width: 100px;
  height: 100px;
  display: block;

but its not showing perfectly, also somepart of image going in background , i also tried Z-Index : 99999 , to show on top.

Answer 1

you can try using :before element. Here is the code based on your site

a#launch-tab-4:before {
    content: " ";
    width: 100px;
    height: 100px;
    display: block;
    background: #00aa00;
}
a#development-tab-4:before {
    content: " ";
    width: 126px;
    height: 100px;
    display: block;
    background: #eeaaff;
}
a#planning-tab-4:before {
    content: " ";
    width: 100px;
    height: 100px;
    display: block;
    background: #00eeff;
}
a#brainstorming-tab-4:before {
    content: " ";
    width: 100px;
    height: 100px;
    display: block;
    background: #000;
}

it should look like this

replace the colors with your images and you may adjust the width and height