Stack Overflow
Stack Overflow

Questions tagged [bootstrap-grid]

Bootstrap Grid is Twitter's flexbox-based grid system that uses classes to determine the layout of your document. Use the [css-grid] tag for questions about CSS Grid, instead.

Bootstrap grids are Bootstrap's flexbox-based grid system that uses classes to determine the layout of your document. Use the tag for questions about CSS Grid, instead.

You can read about Bootstrap grids and how to use them at Twitter's Grid system page.

Read about Bootstrap in general at https://getbootstrap.com/docs/4.0/getting-started/introduction/

254 questions
0
votes
0 answers

Trying to convert CSS Grid to Bootstrap5 Responsive Grid, why are the cols not showing up as boxes?

This is an assignment for school and I have been trying to figure this out for days. The goal of this assignment is: Replace CSS Grid with Bootstrap 5. Every part of the layout needs to use the Bootstrap responsive grid. Honestly, I have a lot of…
DaisieDoodle
  • 1
  • 2
0
votes
1 answer

combining bootstrap breakpoints in class name

Do i really have to declare my bootstrap classes as a combination of all screen sizes and column span for responsiveness? I am using
Major
  • 3
  • 2
0
votes
0 answers

I don't understand the "mb-sm-0" part in cards (bootstrap 5)?

I did get what I expected but the thing is that I don't quite understand that part which says mb-sm-0
Special…
Ahmed Aishan
  • 1
  • 1
0
votes
0 answers

Problem with row-alignment using React & Bootstrap GRID system

Using React.JS and BootStrap grid system, I'm aiming to build the following page. However, with the code linked at the bottom, the page looks like this (the alignment of the elements is wrong in multiple places. For example, the banner and search…
AndrewHoover898
  • 159
  • 1
  • 9
0
votes
0 answers

Superimpose canvas and img in a bootstrap grid

The following code concerns the second row of the screenshot. I want to superimpose the canvas (black square) to the stimuli (the square with the figure). Thanks
nasant
  • 1
  • 1
0
votes
1 answer

Is it normal to specify all sizes (xs,sm,md,lg,xs) for every single column in a row, in bootstrap grid?

I have made an array of 30+ footballplayers, and was planning on printing them all to columns with a for-each loop, into a single row within a container with bootstrap grid. FOR NOW I have just manually typed out a placeholder (the one with Steven…
nostrad0muz
  • 33
  • 5
0
votes
1 answer

Rows and colums with bootstrap not working

So im trying to display multiple cards in a row I followed the documentation but for some reason my cards keep displaying in a single colum. Can anyone see what im doing wrong??

Recomendaciones…

Elisa Correa
  • 3
  • 2
0
votes
1 answer

BootStrap 5 React Js 4 products in a row not getting displayed

I'm a beginner in React Js, and I'm using React Js with BootStrap 5.2.0 My product cards are not getting displayed in a row I want to display 4 product cards in a row. Adding Codes: Home Page code:
…
user14111271
0
votes
1 answer

How to place two divs on the right for desktop, below for tablet using Bootstrap

I'm currently trying to place some divs using Bootstrap grid system, and after multiple attempts it seems like it's almost working. However, there is some weird extra padding on the right, and I can't figure out how to properly remove it. Here is a…
Gugu72
  • 2,052
  • 13
  • 35
0
votes
1 answer

Why is a column going into the next row when there are only 12 columns?

I have a row with 4 columns that are each 3 wide, which adds up to the 12 that are supposed the be in a row, but for some reason the last one is still going onto a new row. Any idea how to fix this? Here's my code:
Enderrrose
  • 3
  • 1
0
votes
1 answer

Bootstrap grid is not working on codeply or devtools. size of
is not changing

I tried using viewport meta tag in head. I tried using a div class="container" around it. no matter what i do. its not working on codeply, and chrome devtools. but its working when i change my browser size. i tried using different bootstrap versions…
Avijat
  • 13
  • 2
0
votes
0 answers

Fixing uneven columns in Bootstrap 5 grid

I've been studying web development for 2 months now. Currently tinkering with bootstrap. How do I fix this problem? I want the 2 columns to be same height but the right columns keeps on overflowing. I assumed that the left column will match the…
user2393148
  • 21
  • 1
  • 3
0
votes
0 answers

How to reduce the gap between rows, as well as add a thin margin between every item of a Bootstrap lightbox?

I would like to have a thinner space between my 3 rows, and ideally and really thin space (close to the row no-gutters class) between each of these pictures. Here is the result:
Alex NJ
  • 1
  • 1
0
votes
3 answers

How to add spacing between columns in Bootstrap 5?

screenshot i want like this As you can see in the picture, I can't put a space between the red and blue columns. I tried many Bootstrap classes, but I couldn't get the result I wanted. I added m-4 to the Navbar, Header and the sections below. When I…
Erdil
  • 3
  • 3
1 2 3
…
16 17