Tengo que siguiente problema. Llevo dos dias buscando una solucion, pero no la encuentro.
Resulta que tengo una pagina y su correspondiente hoja de esilo. El problema es que tengo algunos elementos flotantes y establezco una imagen de fondo, pero en algunas paginas se ve y en otras no.
Les adjunto el HTML y CSS:
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>titulo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="no-cache">
<meta http-equiv="Expires" content="-1">
<meta http-equiv="Cache-Control" content="no-cache">
<link rel="stylesheet" href="estilo.css" type="text/css" media="screen" />
<style type="text/css">
#contenido {
display:inline-block;
width:879px;
padding-left:10px;
border-left:1px solid #B0C4DE;
margin:0px !important;
background-image:url("contacto.jpg") !important;
background-position:right center !important;
background-repeat:no-repeat !important;
}
</style>
</head>
<body>
<div id="cabecera">
<span class="logo">
<img src="logo.png" alt="Logo" />
</span>
</div>
<div id="cuerpo">
<div id="barra_izquierda">
<div id="menu">
<a class="menu_item" href="index.php?cat=">inicio</a>
<a class="menu_item" href="index.php?cat=quien">quien soy</a>
<a class="menu_item" href="index.php?cat=servicios">servicios</a>
<a class="menu_item" href="index.php?cat=precios">precios</a>
<a class="menu_item" href="index.php?cat=contacto">contacto</a>
</div>
</div>
<div id="contenido">
<div id="min_height"></div>
<h3>Contacto</h3>
<p>Para contactarme, completa el siguiente formulario. Los emails los recibo de forma instantánea en mi movil.</p>
<div class="info_derecha">
Horario de atención:
<br />
Lunes a Viernes
<br />
de 8:00 hs. a 20:00 hs.
</div>
<p class="nota">Los campos en rojo, son obligatorios.</p>
<form method="post" action="process_contact.php">
<div>
<span class="_75 obligatorio_texto">Nombre:</span>
<span><input type="text" name="nombre" id="nombre" value="" /></span>
</div>
<div>
<span class="_75 obligatorio_texto">Apellido:</span>
<span><input type="text" name="apellido" id="apellido" value="" /></span>
</div>
<div>
<span class="_75 obligatorio_texto">Email:</span>
<span><input type="text" name="email" id="email" value="" /></span>
</div>
<div>
<span class="_75 obligatorio_texto">Teléfono:</span>
<span><input type="text" name="telefono" id="telefono" value="" /></span>
</div>
<div>
<span class="_75 obligatorio_texto">Urgencia:</span>
<span>
<select name="urgencia" id="urgencia">
<option value="">Seleccione...</option>
<option value="1">Normal</option>
<option value="2">Urgente</option>
<option value="3">Muy urgente</option>
<option value="4">Emergencia</option>
<option value="5">Critica</option>
</select>
</span>
</div>
<div>
<span class="_75 obligatorio_texto">Asunto:</span>
<span><input class="_200" type="text" name="asunto" id="asunto" value="" /></span>
<span class="nota">Debe tener como mínimo 10 caracteres y como máximo 40.</span>
</div>
<div><span class="_75 obligatorio_texto">Mensaje:</span></div>
<div><span><textarea rows="10" cols="70" name="mensaje" id="mensaje"></textarea></span></div>
<div title="Esto nos sirve para saber que usted es una persona, y no un ordenador. De esta manera, evitamos el SPAM.">
<span><img src="captcha.php" /></span>
<span><input type="text" class="_100 obligatorio_control" name="captcha" value="" /></span>
<span class="_250">Introduzca los caracteres de la imagen.</span>
</div>
<div><input class="_100" type="submit" name="Enviar" value="Enviar" /></div>
</form>
<br />
</div>
</div>
<div style="clear:both; margin:0px !important"> </div>
</body>
</html>
Código:
Nota: Todas las imagenes existen y todos los archivos estan bien ubicados. En principio, tampoco he cometido errores tipograficos.* {
padding:0px;
margin:0px;
border:0px;
border:none;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
color:#000000;
background-color:#FFFFFF;
text-align:justify;
outline:0;
}
body {
width:1000px;
margin:0 auto 0 auto;
}
#cabecera {
width:1000px;
height:50px;
border-bottom:1px solid #B0C4DE;
margin:0px !important;
}
.logo img { margin-top:3px; }
#cuerpo {
margin:0px !important;
}
#barra_izquierda {
width:110px;
float:left;
margin:0px !important;
}
#contenido * {
z-index:100000;
}
#min_height { height:500px; width:0px; float:right; z-index:-100; margin:0px !important; }
#menu {
width:110px;
border-bottom:1px solid #B0C4DE;
}
#menu .menu_item {
text-decoration:none;
padding:2px;
font-size:10px;
color:#000000 !important;
text-align:center;
background-image:none;
display:block;
}
#menu .menu_item:hover {
background-color:#B0C4DE;
font-weight:bold;
color:#000000 !important;
}
input, textarea, select {
border-width:1px;
border-style:solid;
text-align:left;
}
input[type="submit"], input[type="button"] {
padding-left:5px;
padding-right:5px;
border-color:#B0C4DE;
padding:3px;
text-align:center;
}
a, a:link, a:active, a:visited {
text-decoration:underline;
font-size:12px;
}
hr { width:1px; }
h1 { font-size:20px; margin-top:10px; margin-bottom:10px; }
h2 { font-size:18px; margin-top:10px; margin-bottom:10px; }
h3 { font-size:16px; margin-top:10px; margin-bottom:10px; }
h4 { font-size:14px; margin-top:10px; margin-bottom:10px; }
h5 { font-size:13px; margin-top:10px; margin-bottom:10px; }
h6 { font-size:12px; margin-top:10px; margin-bottom:10px; }
p { font-size:12px; line-height:18px; margin-bottom:5px; }
div { margin-bottom:10px; }
form { margin-top:20px; margin-bottom:5px; }
form div span { display:inline-block; }
ul {
margin-left:10px !important;
padding-left:12px !important;
list-style-image:url("vinetas.png");
}
li {
font-size:12px;
margin-bottom:5px !important;
}
.info_derecha {
float:right;
display:inline-block;
margin-left:10px;
padding:10px;
border:1px solid #B0C4DE;
width:200px;
text-align:center;
clear:left;
}
.exito {
padding:2px;
border: 1px solid #009900;
background-color:#00FF33;
}
.exito p { margin-bottom:3px; background-color:#00FF33; }
.error {
padding:2px;
border: 1px solid #FF0000;
background-color:#FFFF66;
}
.error p { margin-bottom:3px; background-color:#FFFF66; }
.nota {
font-size:9px;
color:#B0C4DE;
}
._25 { width:25px; }
._50 { width:50px; }
._75 { width:75px; }
._100 { width:100px; }
._150 { width:150px; }
._200 { width:200px; }
._250 { width:250px; }
._300 { width:300px; }
._350 { width:350px; }
._400 { width:400px; }
.obligatorio_control {
border-width:1px;
border-style:solid;
border-color:#FF0000;
}
.obligatorio_texto {
color:#FF0000;
}
.margen_izquierdo { margin-left:20px; }
.resaltar {
font-weight:bold;
font-size:12px;
}
.hr {
margin-top:3px;
margin-bottom:3px;
color:#B0C4DE;
background-color:#B0C4DE;
height:1px;
}
Muchas gracias.
