Buenas, llevo tiempo leyendo este foro, pero nunca me había registrado, así que saludos.
A ver tengo un problema que creo que es simple, pero no sé como solucionarlo...
Tengo dentro de un div, otros 2 div, uno con el menú y otro con el contenido (que será texto).
El problema viene cuando quiero poner los dos alineados horizontalmente, que no lo consigo.
La estructura que quiero es esta:
Y el código que tengo es este:
El html:
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="style.css" type="text/css" rel="stylesheet">
<title>Proyecto de prueba css</title>
</head>
<body>
<div id="contenedor">
<div id="botones">
<ul>
<li><a href="#">link 1</a></li>
<li><a href="#">link 2</a></li>
<li><a href="#">link 3</a></li>
</ul>
</div>
<div id="contenido">
<p>Contenido alineado a la derecha de los botones!!
<br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br />
Fin del contenido </p>
</div>
</div>
</body>
</html>
el style.css:
Código:
#botones{
position:relative;
border: 1px solid black;
width: 20%;
margin: 2px;
text-align:left;
}
#botones ul{
list-style-type: none;
}
#contenido{
border: 1px solid black;
position:relative;
width: 77%;
text-align:left;
left: 21%;
top: -92px;
text-align:left;
padding: 5px;
}
#contenedor{
color:red;
border: 2px solid black;
width: 780px;
margin: 0 auto;
}
Pues bien así consigo alinearlos de manera horizontal, el problema es que me deja un espacio abajo, que no quiero que me deje.
PD.: Tanto el tamaño del contenido, como el tamaño del menú, no sé cual es, por lo que no puedo decir que el contenedor tenga un tamaño determinado, ni un tamaño mínimo.
Gracias por adelantado