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

How can I make the width of two Bootstrap 5 Grids even?

I am remaking my portfolio and in the projects section I want the description on column and the project image on the other. I have used grids in the past without having an issue with the width of the columns and the spacing, but this time, I cannot…
Amaya
  • 11
  • 4
0
votes
1 answer

class="d-none d-lg-block" in Bootstrap

I'm trying to use class="d-none d-lg-block". But it doesn't work for me. Below is the code that I'm trying. Can you please correct me if I'm wrong?

Corporate Leadership

Peter…

Malsha Madushani Kalahewaththa
  • 186
  • 3
  • 19
0
votes
1 answer

Can I align navigation in Bootstrap (5) to the grid? As in my example?

Is it even possible to do it? I would appreciate any directions. I would like to stay within Bootstrap framework Text blocks should be aligned with the navigation border left and right:
Gothearl
  • 1
  • 1
0
votes
1 answer

Bootstrap Bigger Icon

in the screenshot below, i have tried to add 2 button icons in 2 different columns which are also children of a row. I want that buttons to fit as much as big they can in the column as you see. Here is my code for that specific row;
Ekim Cem Ülger
  • 50
  • 6
0
votes
2 answers

How to dynamically create a new row?

I'm using react-bootstrap and I'm wondering if it's possible to dynamically go to the next row based on code. Let me show you what I'm trying to do : // components/WeatherList.js import React from 'react' import { Col, Row } from…
J.erome
  • 688
  • 7
  • 26
0
votes
1 answer

PrimeVue DataTable scrollable header misaligned

when using a scrollable PrimeVue DataTable with fixed column widths (using px), in conjunction with Bootstrap grid, I am getting this behaviour: This issue only seems to occur if the table has more than roughly 5 rows, and will happen reactively…
user14131782
  • 736
  • 1
  • 11
  • 20
0
votes
1 answer

Right alignment first column and left align second column in div of Bootstrap

I looked through the official Bootstrap grid layout page and there are many examples of alignment. I am looking forward to a class that will make the layout like Every content of the first column will start with right alignment and every content of…
mhhabib
  • 2,975
  • 1
  • 15
  • 29
0
votes
1 answer

adjusting span value inside a col in bootstrap 4

I am currently using bootstrap 4 for the cards. I would like to add a numbering beside my card. which is show in the image below. I tried adding padding-top on the span text the same goes with the assigned col of the span text but the card beside it…
Mike
  • 27
  • 1
  • 5
0
votes
2 answers

CSS: How to position a panel slightly off the page

I'm having a problem moving a panel slightly of the page like that: enter image description here I tried width: 120% it does work but when I resize the image moves out of its original position, I'd like it to look similar on different screens, the…
Mikail G.
  • 3
  • 2
0
votes
1 answer

Animated grid column: force to screen border

I'm working on an animated grid that changes the size when hovering. Here is the code pen (make sure it is in desktop mode, not mobile): https://codepen.io/marco_lu/pen/abBmwEJ This is the JS I used for animation: $(".home-tile").hover( function…
Marco
  • 9
  • 5
0
votes
2 answers

Custom and Responsive Grid Width at Bootstrap 4

My code is below: