Actualicé mi publicación un poco. Inténtalo de nuevo. Tendrás que jugar con el tamaño de la imagen para obtenerlo como deseas. No tengo idea de qué tamaño quieres y usar 300 para todo funcionó bien para mí. El tamaño de la imagen será una cuestión de gusto.
Estoy cerca de la solución… es culpa de Chrome…
Aparentemente en Safari se ve perfecto - gracias por tu ayuda
Ahora la pregunta es: ¿por qué Chrome hace esto?
1 me gusta
No tengo ningún problema en Chrome de Windows ni en Safari de iOS. Usé ambos para hacer mis capturas de pantalla y publicaciones. Prueba el código actualizado que publiqué. Podría solucionarlo.
mismo problema…
¿Qué problema? ¿El problema de tamaño de Chrome?
Disculpa por no haber sido claro; el problema es que cuando uso mi navegador principal (Chrome), no puedo ver el logo en el pie de página. Cuando uso Safari, sí puedo ver los logos en el pie de página. También intenté usar Chrome en el MacBook de mi novia y funcionó bien para ella; podemos ver los logos en el pie de página. Así que podría haber algo extraño con mi Chrome; no tengo ni idea de qué.
También noté que en el teléfono el formato no está correctamente escalado, ¿sabes cómo solucionarlo?
¿quieres que las imágenes se encojan y expandan con el tamaño de la pantalla? también puedes hacer un pie de página diferente para la vista móvil o simplemente poner el pie de página en la vista de escritorio. notarás que hay secciones en la pantalla de edición de HTML/CSS para escritorio y móvil, con las mismas pestañas que la sección común.
probablemente tendrás que experimentar con el HTML de tamaño de imagen. probablemente querrás usar tamaños relativos en porcentajes, pero las imágenes son de diferentes tamaños, por lo que será difícil a menos que tengas imágenes del mismo tamaño. no tengo muy claro lo que quieres.
1 me gusta
alguien aquí mucho más inteligente que yo sugirió que tal vez deberías verificarlo en el modo incógnito del navegador para descartar que alguna extensión esté causando problemas allí.
Sugiero que redimensiones las imágenes a dimensiones similares con las que puedas trabajar y luego uses las diferentes secciones CSS y PIE DE PÁGINA de vista de escritorio y móvil para obtener lo que buscas.
1 me gusta
Sí, disculpa por no ser claro, me gustaría que los logotipos se escalaran con el tamaño de la ventana, tanto para el escritorio como para el móvil.
(usar el modo incógnito fue una idea brillante 
)
Hola Michele,
¿Podrías probar el siguiente código?
HTML (eliminé los atributos width de las imágenes y agregué una clase wrap al contenedor):
<div class="wrap custom-footer-image">
<a href="https://www.wur.nl/en.htm/"><img src="https://cdck-file-uploads-europe1.s3.dualstack.eu-west-1.amazonaws.com/standard21/uploads/fspm/original/1X/f2f2e6d11a09f6ceadecf437c48b24c8f44ea76d.png" alt="Footer Image"></a>
<a href="https://www.cirad.fr/en/"><img src="https://cdck-file-uploads-europe1.s3.dualstack.eu-west-1.amazonaws.com/standard21/uploads/fspm/original/1X/d0cf79c6442d594dc4efe3a009cd04c277f9bea8.png" alt="Footer Image"></a>
<a href="https://www.uni-goettingen.de/en/1.html/"><img src="https://cdck-file-uploads-europe1.s3.dualstack.eu-west-1.amazonaws.com/standard21/uploads/fspm/original/1X/0da449a3a30e30eaa4467e96189b7bd4e0a28a64.png" alt="Footer Image"></a>
<a href="http://algorithmicbotany.org/"><img src="https://cdck-file-uploads-europe1.s3.dualstack.eu-west-1.amazonaws.com/standard21/uploads/fspm/original/1X/27ca1fc832ecd29153d2ff150011e0dc056d4f93.png" alt="Footer Image"></a>
</div>
CSS:
.custom-footer-image {
display: flex;
justify-content: center;
align-items: center;
gap: 1rem;
a {
flex: 1;
text-align: center;
img {
max-width: 100%;
}
}
}
Cómo se muestra en el escritorio:
En el móvil:
¿Qué opinas?
El diseño móvil podría cambiarse a dos columnas de dos imágenes si son demasiado pequeñas en los móviles.
4 Me gusta
¡Funciona perfectamente, gracias a todos por el gran apoyo!
2 Me gusta
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.