Havas Okulu - Css Mesaj Kutucukları

[Üye Olmadan Linkleri Göremezsiniz. Üye Olmak için TIKLAYIN...]
[Üye Olmadan Linkleri Göremezsiniz. Üye Olmak için TIKLAYIN...]
[Üye Olmadan Linkleri Göremezsiniz. Üye Olmak için TIKLAYIN...]
[Üye Olmadan Linkleri Göremezsiniz. Üye Olmak için TIKLAYIN...]

Kod:

<div class="success">

    <span>Mesajınız başarılı bir şekilde gönderildi.</span>

</div>

 

<div class="warning">

    <span>Veri kaybı yaşamamak için başvurunuzu belirli aralıklarla kaydetmeyi unutmayın.</span>

</div>

 

<div class="info">

    <span>Başvurular ekte sunulan formlar doldurularak yapılmalıdır. Forma uygun olarak yapılmayan veya eksik doldurulan başvurular kabul edilmeyecektir.</span>

</div>

 

<div class="error">

    <span>Hatalı bir işlem yaptınız. Geriye dönüp kontrol ediniz.</span>

</div>

Kod:

.warning, .error, .info, .success {

    padding: 20px 20px 20px 40px;

    margin-bottom: 15px;

    border-style: solid;

    border-width: 1px;

    background-position: 10px 10px;

    background-repeat: no-repeat;

}

 

.warning {

    background-color: #f8fad5;

    background-image: url(images/warning.png);

    border-color: #e5d35b;

}

 

.error {

    background-color: #f5dfdf;

    background-image: url(images/error.png);

    border-color: #ce9e9e;

}

 

.info {

    background-color: #dfeff5;

    background-image: url(images/info.png);

    border-color: #9ebcce;

}

 

.success {

    background-color: #e8f5df;

    background-image: url(images/success.png);

    border-color: #9ece9e;

}