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

How can I ensure that the card reveal length is consistent regardless of the handheld dimensions?

I am using two Bootstrap cards. I conceal one of the cards (which is blue in colour) behind a card (which is white in colour) as illustrated below: ...and use the following code to reveal the concealed blue card behind the white card: …
SirBT
  • 1,580
  • 5
  • 22
  • 51
0
votes
1 answer

populate cards and modals via same json file using react(-bootstrap)?

The data from workData fills correctly. The only fills with the last entry of workData (e.g. Test4, Modal4, test text 4...) my goal is to generate cards and respective modals (for each card) using the data from the…
newhere
  • 3
  • 1
0
votes
1 answer

How to show single blade.php file in another blade.php file as a component/portion

I don't know this is the right way to ask this. But here is my question and if anyone know please answer. I have two blade files in my project. I'll name them 1 & 2. 1st blade file only contains a chart. I'm trying to show that chart in my 2nd blade…
Tharindu Marapana
  • 225
  • 1
  • 5
  • 13
0
votes
1 answer

why my card is not getting aligned horizontally

here is the code for the card section. The cards get down added vertically when added i want them to be horizontally aligned , 3 cards in one row . please help. Thanks a lot
devanshu Thanvi
  • 5
  • 3
0
votes
2 answers

Ignore echo function if database cell is empty (MySQL/PHP)

I am using Bootstrap cards with MySQL/PHP to echo data from a database/ table. I have a column in the database "Favourite", this field is either empty or contains a path to an image. If the corresponding database field is empty for a particular…
TheGasMan
  • 13
  • 4
0
votes
0 answers

Remove Vertical Spacing Between Divs - ASP.NET & Bootstrap

I'm having trouble figuring out whats causing the extra gap between my divs that I am trying to use as cards. I want the columns of the 2 buttons to be more closer together. After finding some similar posts on SO, I tried removing the padding and…
user15974152
0
votes
1 answer

The bootstrap cards could not grid properly

shop.html {% extends 'base.html' %} {% block content %}

List of Products


{% for product in products %}
Dominic Ching Hei
  • 149
  • 8
0
votes
1 answer

Flask - Delete image from static (boostrap card)

I'm trying to create a functionnality where the user is able to upload and delete some images on the fly. The deleting part works but not completely... it successfully deletes an image from my static folder, but for some reason it only deletes the…
ZaraThoustra
  • 85
  • 9
0
votes
1 answer

Cards are not displaying correctly inside of main tag

I am currently working on a little dashboard. I have a file named profile.php in which I tried to create a card with html and css to display some values of the user. However it seems that nothing works on properly displaying the card.. Underneath…
darby
  • 127
  • 8
0
votes
1 answer

Why does my bootstrap v5 card move on vertical window resize?

Problem: I am currently working on a website and tried my best using/learning bootstrap and wanted to implement e.g. 3 cards. But once I resized the window vertically all my elements shift upwards and it kind of destroys the look of the site,…
Fibig
  • 3
  • 2
0
votes
0 answers

Unwanted space on html because of bootstrap cards

I keep getting unwanted extra space on the right side of the webpage whenever I'm adding bootstrap cards that looks like this: image problem, I'm trying to put everything inside of the sections ,does anyone know how to remove those space? thank…
Jonathan Cruz
  • 21
  • 5
0
votes
2 answers

Formatting pricing cards in Bootstrap

I wanted to make 3 pricing cards arranged in a row, such that their width and height are same. Also, the sign-up button in each card has to be at the bottom of card (regardless of how much text the card contains) with some comfortable padding. I…
Jady
  • 15
  • 5
0
votes
2 answers

How to put card in row using react bootstrap, mapping and props?

Hello everyone.. I am new in reactjs. I tried to make card in row using bootstrap in but it results only in vertical line. I tried using row in div but because of mapping it display in vertical line rather than horizontal Hello everyone.. I am new…
Karina Shrestha
  • 11
  • 3
0
votes
1 answer

How can I automatically bring the text in the box to the center with bootstrap?

I need boxes that text in the center. I tried px classes but it doesn't work. it's near but not exactly center. which bootstrap class can ı use in this subject ? enter image description here
Ali
  • 305
  • 3
  • 14
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
1 2 3
…
9 10