Preguntas etiquetadas con css-grid

Estoy tratando de crear una página simple con CSS Grid. Lo que no puedo hacer es centrar el texto del HTML en las celdas de la cuadrícula respectiva. He intentado contenido puesta en distintos divs tanto dentro como fuera de la left_bgy right_bgselectores de juego y con algunas de las …

179 html  css  centering  css-grid 

TL; DR: ¿Hay algo parecido table-layout: fixeda las cuadrículas CSS? Traté de crear un calendario de vista anual con una gran cuadrícula de 4x3 para los meses y en él cuadrículas anidadas de 7x6 para los días. El calendario debe llenar la página, por lo que el contenedor de cuadrícula …

153 css  grid-layout  css-grid 

Necesito implementar un diseño de mampostería bastante descuidado. Sin embargo, por varias razones, no quiero usar JavaScript para hacerlo. Parámetros: Todos los elementos tienen el mismo ancho. Los elementos tienen una altura que no se puede calcular del lado del servidor (una imagen más varias cantidades de texto) Puedo vivir …

134 html  css  flexbox  css-grid 

¿Es posible hacer un ajuste de cuadrícula CSS sin usar consultas de medios? En mi caso, tengo un número no determinista de elementos que quiero colocar en una cuadrícula y quiero que esa cuadrícula se ajuste. Usando Flexbox, no puedo espaciar bien las cosas de manera confiable. También me gustaría …

126 html  css  css-grid 

Entiendo que esto es imposible de lograr usando Flexbox, ya que cada fila solo puede tener la altura mínima requerida para adaptarse a sus elementos, pero ¿se puede lograr usando la nueva CSS Grid? Para ser claros, quiero la misma altura para todos los elementos en una cuadrícula en todas …

101 css  flexbox  grid-layout  css-grid 

Estoy tratando de centrar los elementos internos de una <button>etiqueta con flexbox justify-content: center. Pero Safari no los centra. Puedo aplicar el mismo estilo a cualquier otra etiqueta y funciona según lo previsto (consulte la <p>etiqueta -etiqueta). Solo el botón está alineado a la izquierda. Pruebe Firefox o Chrome y …

91 html  css  safari  flexbox  css-grid 

En el siguiente ejemplo, el círculo se adapta al ancho de la cuadrícula y mantiene su relación de aspecto. A medida que el ancho del contenedor se reduce, los círculos se reducen con él ... Sin embargo, cuando la altura es menor que el ancho (segundo recuadro), el círculo no …

8 html  css  svg  css-grid  aspect-ratio