Hola, al agregar el padding al div comentario me muestra la barra de desplazamiento horizontal dentro del div derecha.
¿Cómo puedo hacer para que no aparezca dicha barra horizontal manteniendo el padding?
Código HTML:
</head>
<body>
<div id="contenedor">
<div id="izquierda">
<p>Este es el texto de la izquierda</p>
</div>
<div id="derecha">
<div id="comentarios">
<div id='comentario' >Nuevo comentario</div>
<p>Este es el texto de la derecha</p>
</div>
</div>
</div>
</body>
</html>
Código:
* {
margin:0;
padding:0;
}
html, body {
height: 100%;
}
#contenedor {
width: 100%;
height: 100%;
}
#izquierda {
height: 100%;
float: left;
width: 200px;
background-color: #f00;
overflow:auto;
}
#derecha {
height: 100%;
background-color:#00FF99;
overflow:auto;
}
#comentarios{
background-color:#E7DFA0;
height:100%;
background-image: url(comienzo.gif);
background-repeat: repeat-x;
background-position: top;
width:100%;
}
#comentario{
background-color:#CCCCCC;
padding: 10px 10px 10px 10px;
text-align:center;
width:100%;
}
Desde ya, muchas gracias por las respuestas.
Saludos