不显示边框和背景图像

Question

.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>

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

Answer 1

你在 html

中拼错了 success

变化：

<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>

Answer 2

您的拼写错误 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>

Fiddle:http://jsfiddle.net/xhydk70v/1/

不显示边框和背景图像

Border and background image not showing

html

css

border

invisible