Preguntas etiquetadas con flexbox

Quiero que los elementos flexibles estén centrados, pero cuando tenemos una segunda línea, tener 5 (de la imagen de abajo) debajo de 1 y no centrados en el padre. Aquí hay un ejemplo de lo que tengo: ul { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; margin: 0; padding: …

91 html  css  flexbox 

Como puede ver, list-itemsel primero rowtiene lo mismo height. Pero los elementos del segundo rowtienen diferentes heights. Quiero que todos los artículos tengan uniforme height. ¿Hay alguna forma de lograr esto sin dar una altura fija y solo usando flexbox ? Aquí está mi code .list { display: flex; flex-wrap: …

91 html  css  flexbox 

Tengo un contenedor flexible con dos elementos flexibles. Quiero establecer un margen superior en el segundo, pero solo cuando esté envuelto y no en la primera línea flexible. Si es posible, quiero evitar el uso de consultas de medios. Pensé que el margen inferior en el primer elemento podría ser …

88 css  margin  flexbox 

Tengo dos elementos dentro de un contenedor, que están uno al lado del otro mediante el uso de caja flexible. En el segundo elemento ( .flexbox-2), estoy configurando su altura en el CSS. Sin embargo, el primer elemento ( .flexbox-1) coincidirá con la altura de .flexbox-2. ¿Cómo dejaría .flexbox-1de igualar …

82 html  css  flexbox 

Estoy centrando un DIV dentro de otro DIV usando un flexbox. Piense en una ventana de diálogo que aparece en el centro de la pantalla cuando sea necesario. Funciona bien, sin embargo, se vería mucho mejor si el espacio arriba y abajo del diálogo no fuera exactamente igual, teniendo el …

23 html  css  flexbox  centering 

Estoy tratando de crear un sistema de menús con una imagen y texto arriba y abajo. Los datos son dinámicos. Quiero que el sistema de menús aparezca de modo que cada imagen esté a la misma distancia entre sí para que se alineen en una cuadrícula de imágenes tanto horizontal …

17 html  css  flexbox 

He codificado un script (con la ayuda de un usuario aquí) que me permite expandir un div seleccionado y hacer que los otros div se comporten en consecuencia al estirarlo por igual para adaptarse al espacio restante (excepto el primero cuyo ancho es fijo). Y aquí hay una imagen de …

9 javascript  jquery  css  flexbox  css-transitions 

Mostrar una galería de imágenes de diferentes tamaños y proporciones con las siguientes especificaciones: Sin espacios en blanco (márgenes) entre imágenes. Respetando la proporción original tanto como sea posible. Imágenes rodeadas por un enlace. Solución no JS. Las imágenes pueden recortarse un poco. Solución portátil El conjunto de imágenes mostradas …

9 css  flexbox  image-gallery 

Luchando para que las cosas se comporten. Tengo una lista dinámica de imágenes en un sitio receptivo. El diseño se genera donde las imágenes pueden estar en filas / columnas o filas de columnas. Este ejemplo está cerca, pero las imágenes emparejadas no se alinean en la parte inferior a …

8 html  css  flexbox  object-fit