Tengo un inconveniente con mi sitio web en desarrollo.
Lo que sucede es que al meter un código PHP dentro de la página, el diseño se deforma.
¿Cuál es la causa de este inconveniente y como lo puedo solucionar?
Espero sus prontas respuestas, de antemano muchas gracias por su atención.
Código CSS :
html, body{ height: 100%; margin: 0; padding: 0;}
#container {
width: 100%;
margin: 0 auto;
overflow: hidden;
height: auto;
min-height: 100%;
}
header {
width: 100%;
height: 40px;
background-color: #65604F;
}
header legend {
font-family: arial, helvetica sans-serif;
font-size: 20px;
position: relative;
top: 10px;
left: 5px;
color: #fff;
}
nav {
width: 100%px;
height: 40px;
border: 0.1em solid #ccc;
}
nav ul {}
nav ul li {
display: inline;
position: relative;
right: 40px;
}
nav ul li a {
text-decoration: none;
font-family: arial,helvetica sans-serif;
font-size: 14px;
margin-left: 20px;
color: #262323;
position: relative;
bottom: 5px;;
}
.dolar_total {
float: right;
display: inline;
margin-left: 100px;
}
#content {
width: 85%;
background: #DDD;
position: relative;
min-height: 100%;
height: auto !important;
height: 100%;
}
#principal {
width: 60%;
height: 642px;
margin-top: 5px;
float: left;
border: 1px solid #ccc;
}
#secundario {
width: 39%;
height: 642px;
margin-top: 5px;
float: left;
border: 1px solid #ccc;
}
.recomendaciones {
width: 755px;
height: 70px;
display: block;
margin-top: 3px;
margin-left: 5px;
border: 1px solid #ccc;
}
.divisas {
width: 243px;
height: 100px;
margin-top: 3px;
margin-left: 5px;
display: inline-block;
border: 1px solid #ccc;
}
#entradas_y_salidas {
width: 498px;
height: 276px;
border: 1px solid #ccc;
}
#pos_compras {
width: 250px;
height: 383px;
float: right;
border: 1px solid #ccc;
}
aside {
width: 15%;
height: 642px;
margin-top: 5px;
float: left;
border: 1px solid #ccc;
}
.loca {
width: 245px;
height: 267px;
margin: 5px 4px 4px;
display: block;
border: 0.1em solid #ccc;
}
footer {
width: 100%;
background: #CCC;
position: absolute;
bottom: 0 !importante;
bottom: -1px;
height: 40px;
}
footer p {
margin-left: 5px;
font-family: arial,helvetica sans-serif;
font-size: 14px;
color: #a3a3a3;
}
Código HTML :
<!DOCTYPE html>
<head>
<title>
Prueba
</title>
<meta charset="utf-8">
<meta author="">
<meta description="">
</head>
<body>
<div id="container">
<header>
<legend>
Prueba
</legend>
</header>
<nav>
<ul>
<li><a href="inicio.php">Inicio</a></li>
<li><a href="#"></a></li>
<li><a href="lista.php">Registros</a></li>
</ul>
</nav>
<div id="content">
<div id="principal">
<?php
//Llamamos al archivo conexion.php
require_once ("conexion.php");
//Preparamos la consulta
$consulta = "SELECT * FROM datos";
//Ejecutamos la consulta
$eje_consulta = mysql_query ($consulta,$conexion) or die ("Error al ejecutar la consulta").mysql_error();
/*
Verificamos si hay coincidencias en nuestra tabla de datos respecto a la
información que solicita el usuario. Si la respuesta a nuestro condicionante
es True, nos va a mostrar en pantalla los datos, de lo contrario, nos
mostrará un mensaje (No has resgistrado ningún dato). "En un fúturo que la app
se ponga en línea se modificarán las base de datos".
*/
if (mysql_num_rows($eje_consulta) > 0) {
while ($lista = mysql_fetch_array($eje_consulta));
echo $lista[fecha];
echo $lista[motivo];
echo $lista[descripcion];
echo $lista[entrada];
echo $salida[salida];
}else {
echo "No has registrado ningún dato";
}
mysql_free_result ();
mysql_close ();
?>
</div>
<div id="secundario">
</div>
</div>
<aside>
</aside>
<footer>
<p>Hola mundo 2014</p>
</footer>
</div>
</body>
</html>
