Rank 1
Iron
Hi, I am using React Bootstrap, and want a 3 column layout. The third column should contain the grid. This works fine and all looks in order if the column widths are within a certain size, but when large the grid displays underneath the first 2 columns.
There must be some CSS issue but it's only happening with the grid. How do I keep the grid within the third column, regardless of the grids column sizes?
I've created a demo/example below, please assist! I've set all columns to 500px to demonstrate the problem.
https://stackblitz.com/edit/react-us4svr-iauvwn?file=app%2Fmain.jsx
Thanks.
1 Answer, 1 is accepted
Rank 4
Bronze
Iron
Iron
Try the following - https://stackblitz.com/edit/react-us4svr-cdjn4m?file=app%2Fmain.jsx
<Row style={{ flexWrap: 'unset' }}>
Rank 1
Iron
Hi, thank you. That fixed it. I had actually tried this a few days ago but in a more complicated set up and it didn't work so must have had it at the wrong level. Now I know it works I've used it correctly in my project.
Thanks again.