Hola a todos!
Soy nuevo en este foro, y novato en el lenguaje CSS
Despues de estrujarme durante 30 minutos el cerebro he preferido pedir ayuda.
Mi intencion es poner una imagen de 45 x 45 píxeles, y de seguido un texto pero que este este centrado (en la mitad de la imagen)
Así me gustaria que quedara
Pero así me queda:
He probado con padding y margin, pero nada
Código CSS:
Código:
body
{
background-color:#EBEBEB;
}
#top-bar
{
background-color:#82C06B;
border:1px solid #72B15B;
border-bottom:1px solid #72B15B;
height:45px;
position:relative;
border-radius:4px 4px 0px 0px;
max-height:45px;
}
h1.title-bar
{
font-size:18px;
color:#fff;
padding-left:25px;
}
#in-center
{
background-color:#F5F5F5;
margin:100px auto auto auto;
width:980;
height:100%;
border:1px solid #DCDCDC;
border-bottom:2px solid #DCDCDC;
border-radius:0px 0px 5px 5px;
}
#noticia
{
width:100%;
min-height:50px;
color:black;
border-bottom:2px dashed #EAEAEA;
}
#noticia:hover
{
-moz-transition:1s all;
-webkit-transition:1s all;
-o-transition:1s all;
background:#154aa1;
color:white;
border-bottom:2px dashed #123F87;
}
#contenido
{
display:none;
}
#readmore
{
float:right;
margin:13px auto auto 0;
padding-right:4px;
font-weight:bold;
font-size:16px;
}
#readmore:hover
{
-o-transition:1s all;
-webkit-transition:1s all;
-moz-transition:1s all;
color:black;
}
img.frame
{
font-size: 16px;
font-weight:bold;
float:left;
width:45px;
height:45px;
}
#frametext
{
font-size: 16px;
font-weight:bold;
verti
Y HTML
Código:
<html>
<head>
<!--Incluimos los META-->
<meta name="Keywords" content="FPgames, FingerPrintGames,FPG,FingerPrint Games, Finger Print Games">
<meta name="Description" content="Noticias, Curiosidades, Juegos.Todo en la nueva página de FPgames.!Flaming Logic!" >
<meta name="Robots" content="all" >
<meta http-equiv="Pragma" content="no-cache" >
<link rel="stylesheet" type="text/css" href="style.css">
<title>FPGames !Flaming Logic!</title>
</head>
<body>
<div id="in-center">
<div id="top-bar"><h1 class="title-bar">Noticias</h1></div>
<div id="Noticia"><div id="readmore">Read more</div><img class="frame" src="http://nosoloiphone.files.wordpress.com/2009/01/2255692755_d69ac763d2.jpg"/><div id="frametext"> el texto a mostrar </div><div id="contenido"></div></div>
</div>
</body>
</html>
Gracias por la ayuda!