Div Layout: Ancho de la columna de la izquierda estática, strechacle ancho de la columna derecha
Pregunta
% 19 Left Anchura de la sección,% 80 ancho del contenido:
Pero yo quiero arreglar sección izquierda a 200 píxeles y la sección de contenido es el resto de la anchura del área visible.
¿Cómo puedo hacer esto con CSS?
<html>
<head>
<title>TWO-COLUMN LIQUID LAYOUT WITH FLOATING BOXES</title>
<style type="text/css">
body
{
margin: 0px;
padding: 0px;
}
div
{
border: 1px solid black;
}
#header
{
background: #0f0;
width: 100%;
}
#leftcol
{
background: #f00;
float: left;
width:19%;
/* max-width: 200px; */
height: 500px;
}
#content
{
background: #fff;
float: left;
width: 80%;
height: 500px;
}
#footer
{
background: #0f0;
clear: both;
width: 100%;
}
</style>
</head>
<body>
<div id="header">
Header Section</div>
<div id="leftcol">
Left Section</div>
<div id="content">
Content Section</div>
<div id="footer">
Footer Section</div>
</body>
</html>
Solución
Hay un montón de plantillas ya hechas que funcionaría aquí, echar un vistazo a estos por ejemplo:
Otros consejos
Tome un vistazo: http://www.brunildo.org/test/lf100r.html
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow