CSS background image not working

2019-08-04 01:13发布

问题:

I have a modal demo here (fiddle)...

When it comes up, the background image for the modal window shows up. However, in this code below, you'll see I have a background image for the close window function. It's not showing up and I don't understand why. The CSS should have it showing in the top, right-hand corner.

.reveal-modal .close-reveal-modal {
    background: #eee url(http://webfro.gs/south/kb2/images/broken_link.png) no-repeat;
    position: absolute;
    top: 50px;
    right: 100px;
    text-shadow: 0 -1px 1px rbga(0,0,0,.6);
    cursor: pointer;
    } 

回答1:

You div has no content, so you need to add a height and width:

.reveal-modal .close-reveal-modal {
    background: #eee url(http://webfro.gs/south/kb2/images/broken_link.png) no-repeat;
    position: absolute;
    top: 50px;
    right: 100px;
    text-shadow: 0 -1px 1px rbga(0,0,0,.6);
    cursor: pointer;
    height:50px;
    width:50px;
    } 

50px is probably too much