Questions tagged [flexbox]
CSS module for flexible layouts providing a broad range of options for aligning elements while eliminating the need for floats and tables.
flexbox
22,480
questions
0
votes
1
answer
22
views
How to merge flex columns into larger columns to prevent overly stretching? [duplicate]
I have this situation where some columns are really large and others are smaller and I would like to merge these smaller ones not to waste space.
The container div has flex direction row and the ...
- 1,757
0
votes
1
answer
28
views
How to display many div in straight line and use div's width instead of expanding to the container width
I need some help with flex box shrinking or expanding the content within the same line without wrapping. Basically, I have many div element and each div is 50px length appended to the end to
look like ...
- 39
1
vote
1
answer
42
views
How to overlap flex items in a fix width?
The final result I want is this and the result I am able to obtained is this.
Basically I want the cards to overlap in a fixed width, when it is overflowing its parent.
And when it is not overflowing, ...
- 452
0
votes
0
answers
9
views
FlexboxLayout Not Recognized Despite Correct Dependencies
I have already imported the necessary dependencies for my project to use the flexbox layout. It shows an error that it does not work and cannot find the dependency in my project.
Here i the code I'm ...
-1
votes
1
answer
50
views
CSS Flexbox: Why is my flex item not taking up the full height of its parent container?
I'm trying to create a simple layout using CSS Flexbox, but I'm running into an issue where my flex item is not taking up the full height of its parent container. Here's my code:
.container {
...
0
votes
0
answers
31
views
Npm WARN deprecated @angular/[email protected]: Flex layout is not working in angular 18
I have a large application built in Angular 17 that I've recently updated to Angular 18. Since the flex-layout packages do not officially support Angular 18, I overrode them to make npm install work.
...
- 9,204
0
votes
0
answers
9
views
Limit vertical growth of flex containers and display scrollbar instead [duplicate]
So i have this layout: https://stackblitz.com/edit/ya6vrj-qtzort?file=src%2Fapp%2Fcarousel-basic-demo.html
<div class="flex flex-column border-1">
<div class="flex justify-...
- 816
-1
votes
0
answers
17
views
How to create a specific row spanning flex grid [duplicate]
I am trying to create the flex grid in the attached image. the last column row spans, the second row col spans. I cannot seem to quite get there, can any flex grid experts help?
flex grid example
Been ...
- 1
1
vote
1
answer
45
views
how to make all elements of side panel the same width in flexbox?
I've been trying to center the left and right panel below the header so that header and those panels are in one line (text from the header is exacly below the text from the lower section from both ...
- 11
0
votes
1
answer
50
views
Is there a way to flex field generate by for loops?
This is my code that generates fields using a for loop. I'm expecting the email and phone number fields to be displayed side by side, but instead, they are stacked on top of each other. I believe this ...
- 1
0
votes
2
answers
49
views
How do I set my flex correctly on this sign up page
I am currently working on project #6 of the Odin Project and having some minor problems. I am trying to get my project as close to https://cdn.statically.io/gh/TheOdinProject/curriculum/...
0
votes
1
answer
24
views
Position text in div that uses flex
I'm trying to add text in the top right corner of the screen to use it as a menu over a div that is using flex (the section1 div would contain an image irl). However, it keeps staying in the top left ...
- 89
0
votes
1
answer
18
views
How do you make each image in a flexbox row of images the same height all the time?
I have five images; each one represents a logo. I have made each one the same height in pixels, but they all have varying widths. I want to display them in a flexbox in such a way that all five images ...
- 2,232
0
votes
0
answers
25
views
How can i minimise empty space in a flex box that wraps its content? [closed]
I have a flexbox that is the container for a few child elements that themselves are also flex boxes. The child flex boxes have variable widths and heights due to the different elements within them. ...
- 159
1
vote
2
answers
27
views
Flex-wrap does not wrap items to the next line
I am trying to make a columns layout work using flexbox. I encountered a problem when I tried to make each column of text wrap on to the next line when it does not have any more space. My problem ...
- 23