Float y display

Clase 22 de 67 • Curso de HTML5 y CSS3 2015

Paulo Andres Gonzalez

student•

Discrepo con sus opiniones con respecto a lo enseñado, si bien la profe tuvo varios problemas para resolver en clases "en vivo" (todos nos podemos equivocar o tener errores..y de eso se aprende) creo que a comparación con el de febrero... este arrancó de 0, y nos trataba como "chicos de jardín de infantes" y me parece genial que así sea porque en verdad es desde 0 y es lo que necesito, el de febrero esta bueno pero lo seguiría después de este, porque a mi impresión se trató de cosas ya como "sabidas o resueltas" y no desde " que es html pequeeeeeños? :) " como en este. En definitiva, si ya se tiene conocimientos "avanzados" de este curso evidentemente este no es el apropiado, si para mi que recién comienzo.

Esteban Figueroa

student•

yo soy un completo nuevo en esto y la verdad me dejo mas dudas que certezas al final no entendí nada sobre el float vi un ejemplo que al final no funciono seguí avanzando y me topo con que el html gatos ya tiene centradas las imágenes al medio y aun no entiendo como lo hicieron reviso los vídeos anteriores y no encuentro nada al respecto le puse la clase home y lo centra pero no de la manera que ella lo tiene y me he hecho un lío al final

Manuel Salv. Lemos Foncubierta

student•

Vale muy bien, pero los demas cursos de html tambien es desde 0. Y tenia muchos más nivel que este y mejor explicado. Al menos para mi.

Manuel Salv. Lemos Foncubierta

student•

Hablan de float y display como solución de un problema de maquetación y termina el vídeo sin ver como se soluciona... Personalmente este curso comparado con el de HTML de Febrero a dado un bajón notable. Quitando que en este curso aprenderé SASS.

Raúl Segura Nabarret

student•

Yo también considero que este curso no es muy claro, y que en comparación con otros cursos de HTML5 y CSS3 si ha bajado un poco el nivel. Lo rescatable es como tu dices la introducción a SASS.

Camilo Lira Munizaga

student•

en 1 minuto aprendes sass

Gerardo González

student•

el problema es que no sabe explicar, seguramente tiene el conocimiento PERO es muy difícil seguirle el paso cuando dice que toma "esto de acá" y lo pone "aquí" para que "esto" quede. Osea yo tuviera un conocimiento de 0 no entendería a qué se refiere con "esto de acá", "aquí", o "esto". Les recomiendo que mejor se den una vuelta en Code Cademy para empezar de 0 y luego venir para acá.

Diego Hernández Ramírez

student•

Pues yo no me he "enredado" para nada. Es la primera vez que tomo un curso en Platzi y estoy más que satisfecho. Me ha gustado su forma de enseñar y sencillamente, le entiendo a todo lo que explica. Gracias, Maru. :)

Jesús Ildefonso Muro Esquivias

student•

Concuerdo contigo, yo no se por qué todos se quejan si explica muy bien Maru.

Jhon Jairo Santiago Carvajalino

company_admin•

Las clases deben tener continuidad , sin tantos errores. Además de poner en contexto y no eso de probar y ver que no funciona,

Yeraldin Acevedo Acevedo

student•

quedamos en las mismas...

Antonio Fernández Paternina

student•

También me enrede, la verdad falta mas conceptualizacion y un orden claro en el curso, no ha llenado mis expectativas.

Edwin Ortiz Llamccaya

student•

Llegando a esta parte, siento que me he perdido en cuanto a flex-box, no hay un orden establecido de los conceptos. Seria bueno que hicieran una clase bonus al respecto

Javier Sain Osorno Aguirre

student•

Me parece que no fue concreto el ejemplo para el uso de float y display quede en el aire

Carlos Martínez

student•

Esta clase termina utilizando float y display, para ciertos div. En la clase siguiente esos div utilizan flex y aparecen clases nuevas que no se han visto en ningún video. Lo mismo en las clases en vivo si se explicó todo bien, pero en el sistema de videos no. Me da la sensación de que todo está "cogido con pinzas", demasiado improvisado todo, y al final para alguien que no esté muy puesto en el tema, le puede crear más dudas que certezas.

Jose Garcia

student•

He visto mejores cursos, en fin :(

Eduardo Quiñonez

student•

No fue para nada buena idea usar float.

Arturo Jesus Martínez Sáenz

student•

Eso no es cierto, con el uso de float junto a display y position se pueden lograr maravillas en la maquetación, yo lo hacia mucho antes de que exista el flexbox. Ademas es bueno saber ambos métodos, no en todos los casos un flexbox es la solución.

Erick Orlando Velasco Martínez

student•

Ya me perdí

Luis León

student•

No que la clase era genial?

Nancy Cruz

student•

Nunca he entendido porque hay profesores que no preparan la clase antes de impartirla!!

Inicialmente float era para acomodar una imagen al lado de un texto (párrafos). Uno de los propósitos de display es dejar de utilizar float.
Lo único que causa float es más problemas!! Tan fácil es hacer algo como esto:

.ul-cat {
width:100%;
margin: 0 auto;
text-align: center;
}
.li-cat {
display: inline-block;
max-width: 23%;
width: 100%;
margin: 0 1%;
margin: 0 auto;
}
.container-img, .title-container {
width: 100%;
}
.img {
width: 100%;
}

Suponiendo que es una categoría o una sección importante "el nombre de cada gato", yo lo acomodaría mejor en algún h2, h3, h4, h5 o h6 y dentro de un header!!

Nancy Cruz

student•

No me ha gusto mucho... puede que tenga muchos años trabajando en Frontend pero EN CUALQUIER PROYECTO debes de ver a futuro.

1.- A la hora de ponerlo responsivo, nos dará problemas y más porque estamos utilizando float. Entonces desarrolla el proyecto pensando en esoo!!!! mobile first!!!!
2.- Como hace el código y lo acomoda... es una página CERO OPTIMIZADA!

Roger Carlos Ariel Alba

student•

Hola a todos!
Seguro que todos venimos con altas expectativas de la clase. Pero seamos honestos, estamos en una academia en linea por que queremos, ese es el punto, queremos aprender, nunca, nadie podrá enseñarnos todo.
Pero si puede ponernos problemas para aprender. Vamos todos, exploremos un poco más y compartamos. Animo!

Jorge Espinoza

student•

justo aqui me duplica la numeracion del lista no encuentro el seguimiento.....

Float y display

Materiales

Descarga el código del proyecto

Introducción a HTML5 y CSS3

Preguntas antes de la clase

Diferencias entre Backend y Front-end

¿Qué es un Frontend?

¿Qué es HTML y CSS?

Semántica en HTML5

Metodología BEM

Introducción a CSS I

Introducción a CSS II

Developer Tools en navegador I

Developer Tools en navegador II

Preguntas Y Respuestas

Selectores CSS y flexbox

Preguntas antes de la clase

Flexbox

Imports en CSS

Retícula

Selectores en CSS y Pseudo selectores

Páginas internas

Preguntas y respuestas en clase

Listas Ordenadas, Float y Display

Preguntas antes de la clase

Listas ordenadas

Float y display

Preguntas y respuestas en clase

SASS y workflow profesional

Status HTTP

Counter Increment y pseudoSelectores

Textos y estilos con CSS3 Parte I

Textos y estilos con CSS3 Parte II

Animaciones con CSS

SASS

Preguntas y respuestas en clase

Contenido complementario

¿Por qué tu sitio web es tan lento?: Carga de navegadores

Preprocesadores CSS

Dibujando con CSS

Cómo acceder a la cámara de un dispositivo con la API de HTML5

Cómo crear filtros en CSS

Reticulas en CSS

Proyecto: Creando un App de Clima

HTML, CSS básico y uso de selectores

Estructura y etiquetas en HTML

Introducción a CSS

Selectores en CSS

Atributos del Selector

Selectores de Atributo

Sesión de preguntas y respuestas

Metodología BEM en HTML5 y CSS3

Float vs Display

Unidades de medida

Metodología BEM

Pseudo selectores

Sesión de preguntas y respuestas

CSS y workflow profesional

Progressive Enhancement

Fuentes y tipografías web

Responsive Media Queries

Imagenes Responsive y Retina

Preprocesadores CSS y SASS

Herramientas

Conceptos Básicos de JS y JQuery

Bases de desarrollo web moderno

Definición de JSON y API Rest

¿Qué es JSON?

DOM, BOM, JSON, AJAX

DOM: Document Object Model

Etiqueta Template en HTML5

Geolocation

Closures, Jquery y Local Storage en nuestra aplicación

Closures

Introduccion a GIT

Conectando con API Externa

Inyectando Datos en nuestro template

Añadiendo más ciudades a nuestra app

Guardando datos en LocalStorage

Despliegue con Git y GitHub