Hola, tengo un problema y e intentado de varias formas y no logro dar con la solucion:
Les muestro lo que pasa:
CLICK PARA VER
Les dejo la hoja de estilo y el html.
HTML:
Código HTML:
<!DOCTYPE unspecified PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!--
Nombre del Sitio: Dr. Ezequiel Díaz
Desarrollado por: Silverleaf Software
Creado:
Última Actualización:
Copyright: 2010
-->
<!-- Inicio HTML -->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<!-- Inicio HEAD -->
<head>
<!-- Meta -->
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<!-- Título de la Web -->
<title>Comunicación Médica | Ezequiel Díaz</title>
<!-- Hojas de Estilo -->
<link rel="stylesheet" type="text/css" href="css/reset.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />
<!-- Frameworks JavaScripts -->
<script type="text/javascript" src="js/"></script>
</head>
<!-- Inicio BODY -->
<body>
<!-- Inicio Contenedor Global -->
<div id="contenedor">
<!-- Header -->
<div id="header">
<!-- Header width=960px -->
<div id="header-top" class="center">
<!-- Logo -->
<div id="logo" class="left">
<img alt="Logo" src="">
<h1>Dr. Ezequiel Díaz</h1>
<p>consultoría y comunicación médica</p>
</div>
<!-- Menú -->
<div id="menu" class="left">
<img alt="Menú" src="">
</div>
<!-- Redes Sociales -->
<div id="social" class="left">
<img alt="Facebook" src="">
<img alt="Linkedin" src="">
<img alt="Twitter" src="">
</div>
</div>
<!-- Fin Headerin 900px -->
<div id="header-bottom" class="center"></div>
</div>
<!-- Fin Header -->
<div class="clear"></div>
<!-- Contenido Principal -->
<div id="contenido" class="center">
<h1>Contenido PPAL</h1>
</div>
</div>
<!-- Fin Contenedor -->
<!-- Inicio Footer -->
<div id="footer">
<h1>FOOTER</h1>
</div>
</body>
<!-- Fin BODY -->
</html>
<!-- Fin HTML -->
CSS:
Código HTML:
body {
background-color:#FFF;
}
body, p, td, th, li {
font-family: Arial, Helvetica, sans-serif;
font-size:.875em;
line-height:1.5em;
color:#000000;
}
#contenedor {
width: 100%;
height: 100% auto;
background-color: #88e8da;
}
p {
margin: 0 0 1em 0;
}
/*--- Estilos de los Vinculos ---*/
a:link, a:visited {
color: #B1DA67;
}
a:hover, a:active {
color: #5C8127;
text-decoration: none;
}
h1 {
color: #5C8127;
margin: .825em 0 .5em 0;
font-size: 2.125em;
}
h2 {
color: #5C8127;
margin: .825em 0 .5em 0;
font-size: 1.75em;
}
h3 {
color: #5C8127;
margin: .825em 0 .5em 0;
font-size: 1.5em;
}
h4 {
color: #5C8127;
margin: .825em 0 .5em 0;
font-size: 1.25em;
}
h5 {
color: #5C8127;
margin: .825em 0 .5em 0;
font-size: 1.125em;
}
h6 {
color: #5C8127;
margin: .825em 0 .5em 0;
font-size: 1em;
}
ul {
margin-left: 25px;
list-style-type: none;
}
ol {
margin-left: 25px;
}
blockquote {
margin: 0 0 18px 18px;
color:#666666;
font-style: italic;
}
strong {
font-weight:bold;
}
em {
font-style:italic;
}
/* Definiciones Standards */
.left {float:left;}
.right {float:right;}
.clear {clear:both;}
.small {font-size:.625em;}
.large {font-size:1em;}
.soft {color:#D3D3D3;}
.hide {display:none;}
p.last {margin-bottom:0px;}
.center {margin: 0 auto;}
/* Header */
#header {
width:100%;
height:352px;
background: url("img/header-bg.jpg") repeat-x;
}
#header-top {
width: 960px;
height: 78px;
}
/* Isologotipo y Slogan */
#logo {
width: 660px;
}
/* Menu */
#menu {
width: 150px;
}
/* Redes Sociales */
#social {
width: 110px;
height: 65px;
padding: 10px 0 0 40px;
}
#social img {
width: 20px;
height: 20px;
margin: 15px 5px 0 0;
}
/* Header Bottom*/
#header-bottom {
width: 960px;
height: 274px;
}
/* Contenido Principal */
#contenido {
width: 960px;
height: 100px;
background-color: #CCC;
}
/* Footer */
#footer {
clear: both;
width: 100%;
height: 200px;
background-color: #dfdfdf;
}
#footer p {
font-size:.625em;
}