Estoy tratando de ajustar el siguiente código para que me genere un header y dos columnas: una para el menu y la otra para el contenido. Resulta que si lo hace PERO el header está afectando la altura del contenido y el menu ya que sale el scrollbar. Le había colocado overflow:hidden al body pero pienso yo que no es lo más óptimo y además, que en opera le vale, ya que si hago scroll con la rueda del mouse, este se ejecuta y me hace scroll aunque no se vea.
esto es lo que tengo:
Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>2 Columns</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <style type="text/css"> * { padding: 0; margin: 0; } html, body { height: 100%; } html, body { behavior: url(resources/htc/hover.htc); background-color:#FFFFFF; } #wrap { margin:0 auto; width:100%; height: 100%; } #header { height:66px; background-color:#999999; width:100%; } #main { background:#9c9; float:left; width:185px; height:100%; } #sidebar { background:#99c; width:100%; height:100%; } </style> </head> <body> <div id="wrap"> <div id="header">header</div> <div id="main">menu</div> <div id="sidebar">content</div> </div> </body> </html>
Les agradesco cualquier ayuda o comentario.
Saludos