Grupo de HTML y CSS
Este grupo esta relacionado con nuestro curso profesional de HTML y CSS. Aquí se comparten... View more
organizador:
- Organizado por
-
Problemas con contenidos flotantes
Problemas con contenidos flotantes
Estoy haciendo una pagina simple para poder combinar cajas flotantes, imagenes y unos efectos sobre las imagenes. Quiero alternar, que en unas cajas aparezca la imagen a la derecha y por ende el texto a la izquierda y viceversa, imagen a la izquierda y texto a la derecha. Como es algo repetivo, supuse que la estructura seria la misma y que lo unico que debia cambiar entre cada seccion es la propiedad float de la cajaPadreImagen (donde esta la imagen y su efecto). Para las cajas moradas donde la imagen va a la derecha funciona bien. Pero cuando le toca a las azules, se descompone todo. Para empezar, la caja textoPuro (como se ve en la imagen) se posiciona a la par del cajaPadreImagen de la caja2 y que ademas su texto se desborda y no se queda en su propia caja. Entonces no se porque sucede eso y como solucionarlo. Espero que me haya dado entender para que me puedan orientar, por favor!
- 2 Respuestas
Hola colega,
En tu archivo CSS tienes dos clases:
.derecho{
float: right;
}
.izquierdo{
float: left;
}Cuando quieres colocar la imagen a la derecha veo que si le estas agregando la clase “derecho” a los elementos “cajaPadreImagen”. Pero a los textos “textoPuro” no le estas agregando ninguna clase, así que deberías de agregarle la clase “derecho” cuando quieres que se vaya a la derecha y la clase “izquierdo” cuando quieras que el texto se vaya a la izquierda. Eso es todo.
Anexo imagen de ejemplo y código.
Gracias por la respuesta!
Inicia sesión para responder.