Foros aprenderaprogramar.com
Aprender a programar => Aprender a programar desde cero => Mensaje iniciado por: 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:
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:
<!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:
/*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.
-
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