Dúvidas com Caixa de Avisos - HTML e CSS
Fiz um código HTML básico que seria uma caixa de aviso, aparentemente está tudo certo.
Só que não quer exibir a imagens antes dos texto.
Segue o código HTML:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Caixa de Aviso -->
<link rel="stylesheet" href="assets/css/style.css" media="screen" />
<title>Balões de aviso com CSS</title>
</head>
<body>
<div class="sucesso radius10 sombra">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
<div class="alerta radius10 sombra">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
<div class="erro radius10 sombra">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
<div class="pergunta radius10 sombra">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
</body>
</html>
E o código CSS que estou usando:
*{margin50px; padding:0;}
.radius10{
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
.sombra{
box-shadow: 1px 1px 2px #855;
-moz-box-shadow: 1px 1px 2px #855;
-webkit-box-shadow: 1px 1px 2px #855;
}
.sucesso{
background: #eff4d4 url("images/sucesso.png") no-repeat scroll 10px 10px;
border:1px solid #8fad3d;
color:#596c26;
padding:10px 10px 10px 68px;
min-height:48px;
}
.alerta{
background: #ffea97 url("images/alerta.png") no-repeat scroll 10px 10px;
border:1px solid #e2b500;
color:#995f5b;
padding:10px 10px 10px 68px;
min-height:48px;
}
.erro{
background: #efcec9 url("images/erro.png") no-repeat scroll 10px 10px;
border:1px solid #ad3f30;
color:#943728;
padding:10px 10px 10px 68px;
min-height:48px;
}
.pergunta{
background: #c6d8f0 url("images/pergunta.png") no-repeat scroll 10px 10px;
border:1px solid #4381cc;
color:#5c58b9;
padding:10px 10px 10px 68px;
min-height:48px;
}
O que poderia ser, porque não está exibindo a imagem?
O resultado final seria esse: [http://rbtech.info/demos/boxcss/](http://rbtech.info/demos/boxcss/)
Mas só mostra a caixa e a mensagem, sem os ícones.Discussão (3)
Carregando comentários...