Estou montando um site somente com a utilização de divs, porém quando se diminui o tamanho do browser na vertical, deveria habilitar o scroll do browser na vertical, mas o browser corta o conteúdo do site e não gera o scroll.
segue o conteúdo:
CSS:
html, body {height:100%; margin:0; padding:0; border:0;}
#container{width:100%; height:100%; overflow: hidden; background:#7e7e7e;}
#leftbg{width: 50%; height:100%; display:block; float:left; margin-left: -390px; background:url(imgs/bgsite_left.jpg) top right repeat-x; }
#middlebg{width: 780px; height:auto; display:block; float:left; margin:auto; z-index:1; background:url(imgs/bg_contents.gif) top left repeat-y;}
#rightbg{width: 49%; height:100%; display:block; float:left; margin-right:-390px; background:url(imgs/bgsite_right.jpg) top left repeat-x;}
#top{ width:780px; height:145px; display:block; float:left; background:url(fla_imgs/top_guide.jpg) top left no-repeat;}
#contents{ width:780px; height:auto; min-height:320px; display:block; padding-bottom:15px; float:left; background:url(imgs/bg_contents_top.gif) top left no-repeat;}
#bottom{ width:780px; height:80px; display:block; float:left; background:url(imgs/bg_bottom.gif) top left no-repeat;}
#atuacao{ width:710px; height:210px; display:block; float:left; margin:25px 0px 0px 35px; background:url(fla_imgs/atuacao_guide.jpg) top left no-repeat;}
#banners{ width:470px; height:190px; display:inline-block; float:left; margin:0px 0px 20px 35px;}
#passagens{ width:470px; height:85px; display:block; float:left; margin-bottom:10px; background:url(fla_imgs/banner_passagens_guide.jpg) top left no-repeat;}
#sustentaveis{ width:230px; height:95px; display:inline-block; float:left; background:url(fla_imgs/banner_sustentaveis_guide.jpg) top left no-repeat;}
#null{ width:230px; height:95px; display:inline-block; float:left; margin-left:10px; background:url(fla_imgs/banner_null.jpg) top left no-repeat;}
#news{ width:230px; height:190px; display:inline-block; float:left; margin:0px 0px 20px 10px; background:url(imgs/news_bg.gif) top left no-repeat;}
#feiras{ width:230px; height:90px; display:inline-block; float:left; margin:0px 0px 0px 35px; background:url(fla_imgs/banner_feiras.gif) top left no-repeat;}
#eventos{ width:230px; height:90px; display:inline-block; float:left; margin:0px 0px 0px 10px; background:url(fla_imgs/banner_eventos.gif) top left no-repeat;}
#parceiros{ width:230px; height:90px; display:inline-block; float:left; margin:0px 0px 0px 10px; background:url(fla_imgs/banner_parceiros.gif) top left no-repeat;}HTML:
<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cs" lang="cs"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <style>@import "lynx.css";</style> <title></title> </head> <body> <div id="container"> <div id="leftbg"> </div> <div id="middlebg"> <div id="top"> </div> <div id="contents"> <div id="atuacao"> </div> <div id="banners"> <div id="passagens"> </div> <div id="sustentaveis"> </div> <div id="null"> </div> </div> <div id="news"> </div> <div id="feiras"> </div> <div id="eventos"> </div> <div id="parceiros"> </div> </div> <div id="bottom"></div> </div> <div id="rightbg"> </div> </div> </body> </html>
Pessoal, resolvi a div #container estava com overflow: hidden...
Edição feita por: ThiagoRezende, 19/08/2009, 09:45.
