边框和背景图像未显示[关闭]

Question

http://jsfiddle.net/xhydk70v/

.ui-dialog-container {
    padding:18px;
}
.ui-dialog-success-container {
    position:relative;
    top:-5px;
    left:-35px;
    border:2px solid #91e375;
    border-radius:10px;
    color:#000;
}
.ui-dialog-error-container {
    position:relative;
    top:-5px;
    left:-35px;
    border:2px solid #ff598e;
    border-radius:10px;
    color:#000;
}
.ui-dialog-success-image {
    position:relative;
    top:-20px;
    left:-17px;
    float:left;
    width:32px;
    height:32px;
    background-image: url(/public/img/icon-dialogsuccess.png);
    background-position: top left;
    background-repeat: no-repeat;
    z-index:5;
}
.ui-dialog-error-image {
    position:relative;
    top:-20px;
    left:-17px;
    float:left;
    width:32px;
    height:32px;
    background-image: url(/public/img/icon-dialogerror.png);
    background-position: top left;
    background-repeat: no-repeat;
    z-index:5;
}

<div class="ui-dialog-container">
    <div class="ui-dialog-error-image"></div>
    <div class="ui-dialog-error-container">test</div>
</div>
<br />
<div class="ui-dialog-container">
    <div class="ui-dialog-succes-image"></div>
    <div class="ui-dialog-succes-container">test</div>
</div>

有人可以向我解释为什么“成功 div”没有显示边框吗？在我的现场环境中，它也没有显示图像，而错误是，就像边框一样。我相信我快疯了，因为我看不出哪里出了问题。

Answer 1

您的拼写错误将ui-dialog-succes-container 更改为ui-dialog-success-container。

<div class="ui-dialog-container">
    <div class="ui-dialog-error-image"></div>
    <div class="ui-dialog-error-container">test</div>
</div>
<br />
<div class="ui-dialog-container">
    <div class="ui-dialog-success-image"></div>
    <div class="ui-dialog-success-container">test</div>
</div>

小提琴：http://jsfiddle.net/xhydk70v/1/

Answer 2

你在 html 中拼错了 sucess

变化：

<div class="ui-dialog-container">
<div class="ui-dialog-succes-image"></div>
<div class="ui-dialog-succes-container">test</div>

致：

<div class="ui-dialog-container">
<div class="ui-dialog-success-image"></div>
<div class="ui-dialog-success-container">test</div>