Stack Overflow
Stack Overflow

Questions tagged [bootstrap-cards]

Bootstrap’s cards provide a flexible and extensible content container. Use this tag both for Cards and related classes (such as Card groups)

Cards are a component of Bootstrap.

Documentation (for version 4.0) can be found here, this includes information about associated classes such as card-group and card-deck.

Cards replace panels, wells, and thumbnails (from Bootstrap 3).

146 questions
0
votes
2 answers

Bootstrap Cards same width

I want my cards to cover the equal width of the screen, but my code below is as per content. Tried card-deck, but it didn't helped.
teneji
  • 29
  • 7
0
votes
0 answers

Bootstrap card with vertical title

i am trying to use a vertical title (image attached) with the boostrap card, but i dont find any example how to do this. Any idea how to do this? Thanks for your kelp Vertical Title
Carlos Alberto Cabrera Quiroga
  • 5
  • 1
  • 3
0
votes
1 answer

Bootstrap card is squished when performing a search on the grid of cards

I have added a new image to a card and when I do a search, the card gets squished. Can't figure out if it's grid related to Bootstrap or an issue with image size. I appreciate anyone that has suggestions what I can do to fix this. I have tinkered…
grifftaur
  • 7
  • 3
0
votes
1 answer

Bootstrap 3 card-wide responsiveness to different screen sizes

I have created a Bootstrap 3 card-wide, and set the div class="card-wide-image-wrap" to a min-width of 50%. This ensures correct display on my laptop (otherwise it won't show the full image with overlay text-block). However, a min-width of 50% for…
Ric
  • 75
  • 1
  • 8
0
votes
2 answers

Align the top of the footers bootstrap card deck

I'm using bootstrap 4 to display cards. All is working as expected. The issue I have is that if one of the footers has more content than the others, the footer is raised to accommodate this. Is there a way of the footer pushing the content down and…
steve
  • 471
  • 6
  • 15
0
votes
1 answer

How can i resize bootstraps cards for a website using Django?

I'm trying to add some cards from bootstrap to a website to display images of the products with their prices and the option to add then to the cart but since the image in this card are being retrieved from another website, when I tried to load my…
Joshua Montenegro
  • 1
  • 1
0
votes
1 answer

Crop image in card

I've built this horizontal card with an image on the left, and I've specified a min height for the card which is important. Currently the image fits in the card using width: 100% and height: 100%, but i want it to use the full height of the parent…
Johannes Karsten
  • 69
  • 1
  • 10
0
votes
5 answers

Bootstrap card border disappeared and grid not working

I just got started with web dev in general, so I might be missing something super simple. I'm trying to use Bootstrap cards and have been testing with three of them. I want the card to fit 3 to a row when on a larger screen and then go to 2-col and…
jlin
  • 25
  • 4
0
votes
1 answer

my bootstrap cards are hiding under side bar

i have added the bootstrap cards(in the image below) everything is working fine. but the problem is when i add a side bar and nav bar(actually another file,i included it with php). cards which are left side of the screen gets hidden under side…
maneesh sandra
  • 116
  • 8
0
votes
1 answer

Bootstrap cards not working in bootstrapemail

I have a nice web page built up with cards but they simply dont seem to work when i paste it in the editor in the bootstrapemail editor which returns pure css code.
Abhijeet
  • 689
  • 2
  • 10
  • 19
0
votes
0 answers

Align bootstrap rows horizontally

I have created the following card layout (shown in the screenshot) using bootstrap. The .card-columns class is adding my cards vertically so that I am loosing some part of the card. I want my cards aligned horizontally and exactly 3 cards per row…
maneesh sandra
  • 116
  • 8
0
votes
1 answer

Why ReactJs says the link or path is broken when I put it in Card.img#src?

I'm using ReactJs-bootstrap and I have a Card that has image inside of it. inside the Card there is tag that I imported form ReactJs-bootstrap. the Card.Img there has attribute 'src'. when I try to change the 'src' it does the broken…
pythwan
  • 99
  • 9
0
votes
0 answers

Card overlaps Angular mydatepicker selector

enter image description here I integrated Bootstrap, Jquery with Angular 9. I used jquery data table, Angular Mydatepicker, Angular Select and Bootstrap Card . Card is overlapping select dropdown and datepicker selector. I used Bootstrap 4 and…
Sene
  • 1
0
votes
1 answer

Image in an image overlay in bootstrap cards always shows up on top

I'm having some trouble figuring out why I cannot the image in the follow html snippit to show up anywhere but on top. I've messed with z-index, !important overrides, and other things for a few hours to no avail. I suspect this may have something to…
Will
  • 170
  • 10
0
votes
1 answer

Adjust a card according to the height of the parent container

I have a bootstrap card with a header, footer and a list between these two. I want the header and footer to be fixed and the middle part to be adjusted to the height of the window (the body), so that the middle part can have a scroll bar if the…
urely
  • 1
  • 2
1 2 3
…
9 10