Autor Tema: HTML y CSS hacer que aparezcan scroll vertical y horizontal Overflow CU01038D (Leído 1931 veces)

EnigmaticNerd · « **en:** 16 de Septiembre 2017, 01:01 »

Buenas noches. Este es el enunciado del ejercicio CU01038D del curso básico de desarrollo web con CSS:

Citar

Crea un contenedor div con las siguientes características definidas a través de CSS: ancho y alto 200 píxeles, color de fondo amarilo, borde color azul de 2 píxeles de ancho tipo sólido, un texto de tamaño 30 píxeles y con un largo suficiente para exceder la capacidad del div contenedor, y mediante la propiedad overflow haz que aparezcan scrolls horizontal y vertical que permitan visualizar todo el texto.

Acá el código:

Código: [Seleccionar]

<!DOCTYPE html>
<html lang="es">
    <head>
        <title>CU01038D</title>
        <meta name="author" content="EnigmaticNerd"/>
        <meta name="description" content="propiedad overflow css - aprenderaprogramar.com"/>
        <meta name="keywords" content="overflow, overflow-x, overflow-y, cursos, aprenderaprogramar.com, CU01038D"/>
        <meta charset="utf-8"/>
        <link rel="stylesheet" type="text/css" href="estilos/CU01038B.css"/>
    </head>
    <body>
        <div id="contenedor">
            <div>
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                     Quae pariatur, vero laboriosam eaque. Tempore necessitatibus maxime, ab, 
                     cupiditate cumque nulla tenetur adipisci ipsa beatae totam in fugiat reprehenderit harum animi.   
                </p>

            </div>
        </div>

Acá la hoja de estilos css:

Código: [Seleccionar]

/*Estilos para ejercicio CU01038D*/

#contenedor{
    width:170px;
    margin:auto;
    
}
#contenedor div{
    width:200px;
    height:200px;
    background-color:#FF0;
    border: solid 2px #00F;
    overflow:scroll;
}

p{
    margin:5px;
    font-size:30px;
}

Si tienen correcciones o sugerencias, se las agradeceré enormemente. Gracias.

Alex Rodríguez · « **Respuesta #1 en:** 19 de Octubre 2017, 18:16 »

Hola EnigmaticNerd, el ejercicio está bien resuelto, aunque al probarlo no se mostraba el scroll horizontal. Para forzar que aparezca el scroll horizontal basta con introducir una palabra de gran longitud en el texto, por ejemplo

Lorem ipsum dolor sit amet aprenderaprogramar.comwebdeprogramacion,

Saludos

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias: