04/05/2012, 13:56
|
| Colaborador | | Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 16 años, 6 meses Puntos: 1012 | |
Respuesta: dividir pantalla verticalmente (ancho fijo+ancho variable) no ocupes temas de otros usuarios
eso es algo más complicado Cita: <!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" xml:lang="es" lang="es">
<head>
<meta http-equiv="Content-Type" content="application/xhtml; charset=utf-8" />
<title></title>
<style type="text/css">
* {
margin: 0;
padding: 0;
border: none;
position: relative;
}
html, body {
width: 100%;
height: 100%;
}
#cont {
background: pink;
width: 500px;
height: 94.6%;
margin: 0 auto;
border-width: 1px 1px 0 1px;
border-color: red red transparent red;
border-style: solid solid none solid;
}
#cont #div1 {
width: 500px;
height: 5%;
background: yellow;
border-bottom: 1px solid red;
}
#cont #div2 {
background: pink;
height: 88%;
overflow-x: auto;
padding: 4% 20px;
}
#footer {
width: 500px;
height: 5%;
background: orange;
margin: 0 auto;
border: 1px solid red;
}
</style>
</head>
<body>
<div id="cont">
<div id="div1">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus</div>
<div id="div2">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus eget justo pulvinar at auctor purus tempor. Praesent tempor facilisis commodo.
</div>
</div>
<div id="footer">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pellentesque purus</div>
</body>
</html> |