Foros del Web - Ver Mensaje Individual

kseso? · #2 (**permalink**) 08/09/2009, 16:05

Hola kian:
La idea de una página horizontal casi que pide obligatóriamente que no haya scroll en la vertical.

Mira a ver si esta base te ayuda en algo.
Página en horizontal con un título siempre visible en el mismo sitio (compatible con ie6)

Código html:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
<head>
<title>Kseso? jugando con css</title>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" />
<style type="text/css">
* {margin: 0; padding:0; outline: none; border: 0;}
html, body {
        background: #000;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }
#titulo {
        text-align:center;
        background: #005F5F;
        width:100%;
        margin:0px;
        padding:5px 12px 5px 0;
        color:#fff;
        position: absolute;
        top: 0;
        left: 0;
        font-size: 1.3em;
        z-index:10;
        }
#contenedor {
    color: #fff;
    position: relative;
    overflow: auto;
    height: 100%;
}
#contenido {width: 4000px;}
.noticia {
float: left;
width: 198px;
height: 398px;
border: 1px solid #cdcdcd;
margin: 40px 0 0 20px;
background: #FF6600;
}
</style>
</head>
<body>
<div id="titulo">TÍTULO SIEMPRE VISIBLE</div>
<div id="contenedor">
<div id="contenido">
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
<div class="noticia"></div>
</div>
</div>
</body>
</html>

Un saludo