Question

With these styles and this html the image specified in the background url isn’t shown. What could be the problem? The urls are right.

<style>
    .copy_tool {
    width: 17px;
    height: 15px;
    float: left;
    margin-top: 3px;
    margin-left: 2px;
    background: url("/images/copy_tool.png") no-repeat;
    cursor: pointer;
    background-color: lightgrey;
    }

    .print_tool {
    width: 17px;
    height: 15px;
    float: left;
    margin-top: 3px;
    margin-left: 2px;
    background: url("/images/print_tool.png") no-repeat;
    cursor: pointer;
    background-color: lightgrey;
    }

</style>

<div class="toolbox">
    <div id="copy_readfe" class="copy_tool" title="Copy"></div>&nbsp;&nbsp; 
    <div id="print_readfe" class="print_tool" title="Print" onclick="print_element('div_readfe');"></div>
</div>

Answer 1

The css and html is correct as this jsfiddle proves. Your paths are most likely broken or your images are not showing because of some kind of internal issue.

However your markup could be done better like in this example ( removing redundant css ) or better yet in this example ( conversion to a ul li setup).

Reference

• background-image