Módulo CSS para diseños flexibles que proporciona una amplia gama de opciones para alinear elementos al tiempo que elimina la necesidad de flotadores y tablas.

flexbox...

Siempre que coloco el cursor sobre el texto, quiero que tenga un borde inferior. Sin embargo, también hago que mi texto se mueva hacia arriba. ¿Quizás alguna sugerencia? La imagen anterior es una posición e imagen incorrectas después de que se levante un poco. Sé que no puedes verlo en las capturas ....
18 ago. 2020 a las 19:41
Estoy tratando de tener un formulario que tenga entradas para nombre y apellido . Me gustaría que mis entradas estén en línea y también ocupen el 100% del espacio disponible horizontalmente, y cuando no haya suficiente espacio, se envuelven. Puede ver que esto funciona bien en este jsfiddle https....
18 ago. 2020 a las 19:06
He simplificado mi HTML / CSS en un jsfiddle de lo que intento lograr sin éxito. No puedo hacer que .problem tome el ancho completo. El contenido está representado por el fondo azul, mientras que el cuadro en sí es rojo. Estoy tratando de hacer que todo el contenido desplazable tenga ancho completo ....
15 ago. 2020 a las 11:19
Mi estructura es la siguiente: <ul className={classes.root}> <li className={classes.statsItem}> <div className={`${classes.span} ${classes.willGive}`}>₹0</div> <div className={classes.span}>You will give</div> </li> <li className={classes.statsItem}> <div className={`$....
9 ago. 2020 a las 19:44
Tengo un conjunto de campos con una leyenda que tiene un texto y un botón. Estoy tratando de alinear el botón a la derecha usando flexbox, funciona bien en Chrome pero no en Firefox. Tengo un código mínimo que funciona para mostrar el problema: main { width: 100%; } fieldset legend { display:....
7 ago. 2020 a las 17:49
Tengo un contenedor de caja flexible, con un elemento secundario dentro. Cuando el tamaño de la pantalla se reduce, quiero que el niño también se reduzca. Aquí está mi código existente: Html: <div class="container"> <div class="child"></div> </div> Css: * { margin: 0; padding: 0; ....
7 ago. 2020 a las 16:11
Tengo el siguiente CSS: .turbineContainer{ width: 50%; flex-wrap: wrap; display: flex; } .turbineIcons{ background-color:white; margin: 1em; height: 50px; width: 100px; } .cont....
7 ago. 2020 a las 10:01
Estoy creando un sitio web con una propiedad flexbox. Sin embargo, me gustaría que cuando un usuario pasa el mouse sobre las casillas, me gustaría que el color de la casilla cambiara y cuando esté en el móvil, me gustaría que las casillas se ajustaran en consecuencia. Aquí está mi código y mi intent....
4 ago. 2020 a las 20:19
Estoy haciendo un efecto de máquina de escribir donde mi nombre se escribe, y lo único que funciona para mantenerlo centrado es justify-content: center. Lo único es que no puedo poner un párrafo debajo del elemento flexible, y el párrafo actúa como si no estuviera allí y nada parece funcionar. He pr....
4 ago. 2020 a las 19:37
Yo uso un contenedor flexbox que incluye dos div s de igual ancho. La izquierda muestra una imagen y la derecha un texto. El código envuelve los elementos para Google Chrome pero en Internet Explorer 11, mueve la parte derecha arriba de la izquierda. ¿Cómo puedo arreglar esto? Intenté usar flex: aut....
3 ago. 2020 a las 21:04
Dada la estructura HTML a continuación, ¿cómo hago para que td.expand llene el espacio vertical restante de #outer? Probé varias soluciones (incluido Flexbox), pero nada funcionó para mí. Desafortunadamente, estoy atascado con las dos tablas, así que asuma que la estructura HTML no se puede cambiar.....
3 ago. 2020 a las 00:30
Tengo un ScrollView que tiene dos hijos, y quiero que cada uno de los hijos tenga la altura total del espacio disponible en la pantalla, lo que significa que la vista 1 ocupa toda la pantalla y luego me desplazo hacia abajo para comenzar a ver parte de la diapositiva 2. Si me desplazo completamente ....
31 jul. 2020 a las 20:52
¿Alguien puede explicarme cómo mover el bloque hacia el lado izquierdo cuando la pantalla se vuelve más pequeña? .limited-offer-box display: flex flex-direction: row justify-content: space-around flex-wrap: wrap En mi caso, necesito mover el libro "El ladrón de ....
31 jul. 2020 a las 19:53
Quería agregar un efecto de desplazamiento sobre un elemento como en la figura. Pero no el borde (que se muestra solo en el ejemplo) Pero obtuve el efecto de desplazamiento del siguiente fragmento de una manera diferente. La altura de nav-items no llega a la parte superior e inferior de la caja f....
31 jul. 2020 a las 12:06
Estoy creando mi primer sitio web de portafolio e intento usar flexbox para crear una galería de miniaturas desplazable. La idea es que haga clic en una imagen que represente un proyecto que se vincule a la página de ese proyecto. Me las arreglé para crear un flexbox que se ve bien cuando solo inser....
30 jul. 2020 a las 13:13
Sé que esta podría ser una pregunta estúpida, pero no puedo averiguar cómo centrar verticalmente algunas imágenes dentro de estos contenedores, que son parte de un contenedor más grande que diseñé con flexbox. Realmente soy un principiante, así que lamento todo el lío con las clases y esas cosas. Bá....
30 jul. 2020 a las 13:03
Aquí está mi código HTML de un navbar, estoy tratando de seleccionar selectores CSS para hacer que la fuente de mi LI sea de un color diferente y también eliminar text-decoration, que no funcionan cuando selecciono {{ X2}} o .navbarcontainer .option. Conceptualmente, ¿qué me estoy perdiendo aquí y c....
29 jul. 2020 a las 18:14
Tengo varios elementos flexibles dentro de un contenedor flexible con justify-content: space-between; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -webkit-justify-content: s....
29 jul. 2020 a las 16:05
Estoy buscando crear elementos push a la derecha usando Flexbox. Salida de NavBar deseada: Acerca de la tienda ............. Derecha Derecha Intenté seleccionar #right y usar margin-left: auto pero la derecha no está presionando This is currently my HTML code <nav> <div class="navbarcontainer"> ....
29 jul. 2020 a las 08:46
Tengo una forma piramidal de imágenes contenidas en un Flexbox. Funciona como se espera, siempre y cuando el ancho de las imágenes sea fijo. Si cambio el tamaño de la pantalla (o la cambio a una resolución más pequeña), dado que es un Flexbox, los elementos base (fila inferior) tendrán menos espacio....
27 jul. 2020 a las 17:05
Perdón por el título, no está claro, pero no sabía cómo escribirlo. Básicamente, estoy haciendo un sitio web bastante simple con solo HTML y CSS. Tengo estas 3 cartas que tienen su propio elemento padre <a> porque quería que se pudiera hacer clic en ellas sin importar en qué parte de la tarjeta las ....
27 jul. 2020 a las 07:17
Así que he creado html / css para producir el siguiente aspecto; observe el borde rosa a su alrededor. Pero cuando expando la altura (usando detalles / resumen) el borde rosa alrededor de la parte inferior desaparece: ¿Cómo puedo mantener el borde rosa? html { background-color:hotpink; paddi....
25 jul. 2020 a las 13:00
Tengo un contenedor que aloja un botón de radio a la izquierda y otros botones a la derecha. Por alguna razón, no puedo alinear los botones de radio en línea con los botones de la derecha. Por favor, avísame sobre cómo solucionar esto. Esto es lo que tengo hasta ahora: Código: import React, { Compo....
24 jul. 2020 a las 20:07
Pues el código es .all-card{ width: 100%; height: 100%; background-color: red; } .left-panel-child{ display: flex; box-sizing: border-box; justify-content: flex-start; align-items: center; height: 70px; width: 100%; margin-top: 1px; background-color: da....
24 jul. 2020 a las 14:29
Quiero centrar el div específico dentro del contenedor flex. Me entenderás mejor con el código: Aquí está mi código: <html> <head> <style> div.flex_container { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; ....
23 jul. 2020 a las 20:58