• Saturday , 6 June 2020

Bootstrap 4 Tutorial #9 – Cards

Code Canyon
https://i.ytimg.com/vi/Izc-0yF4EA0/hqdefault.jpg



Hey all, in this Bootstrap tutorial I’ll show you how to use Bootstrap cards. Cards are a more flexible replacement for Panels from Bootstrap 3.

—– COURSE LINKS:
+ Repo – https://github.com/iamshaunjp/bootstrap-4-playlist
+ Atom editor – https://atom.io/a
+ Download GIT – https://git-scm.com/
+ Bootstrap 4 Docs – https://v4-alpha.getbootstrap.com/getting-started/introduction/

Bootstrap 3 Playlist – https://www.youtube.com/playlist?list=PL4cUxeGkcC9g_69kOfXICzT_hZ79_td99

———————————————————————————————
You can find more front-end development tutorials on CSS, HTML, JavaScript, jQuery, WordPress, Node.js & more on the channel homepage…

SUBSCRIBE TO CHANNEL – https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg?sub_confirmation=1

========== PSD to WordPress Playlist ==========

============ Node.js for Beginners Playlist =============

============== The Net Ninja =====================

For more front-end development tutorials & to black-belt your coding skills, head over to – https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg or http://thenetninja.co.uk

================== Social Links ==================

Twitter – @TheNetNinja – https://twitter.com/thenetninjauk

Original source

3d Ocean

Related Posts

20 Comments

  1. Adel
    August 28, 2018 at 17:51

    too easy, awesome dude

  2. Liam
    August 28, 2018 at 17:51

    If I launch my site in Atom I can see the card images, if I launch it by tapping the HTML file I can't see the images?

  3. kuku swuro
    August 28, 2018 at 17:51

    hey NINJA why does my image inside the card grows in size more than its original dimension at lower browser width? please help. thanks

  4. kuku swuro
    August 28, 2018 at 17:51

    Noice.

  5. Ray Renteria
    August 28, 2018 at 17:51

    For some reason i cannot get the node img to appear on my site.

    edit: fixed the issue!

  6. Shar7 well
    August 28, 2018 at 17:51

    Hey man, I just wanted to say that your turorials are EPIC, THANKS SO MUCH 😀

  7. Zmodem
    August 28, 2018 at 17:51

    Just in case anyone was wondering, yes, the cards can be made to all have the same height, regardless of content. Just add the class "h-100" to each div with the "card" class.

  8. Rubin Luitel
    August 28, 2018 at 17:51

    card-block to card-body 😀

  9. mrf0696
    August 28, 2018 at 17:51

    Great series sir. hope you create more tutorial. Your videos really help starting developers like me. thanks for your efforts.

  10. Leo Guzman
    August 28, 2018 at 17:51

    I think an update has been made:
    Instead of using "card-block" to give the text padding in the card, use "card-body".

    Thanks for these great tutorials!!

  11. Helen Letts
    August 28, 2018 at 17:51

    I like your tutorials. They're very straightforward, on target, easy to understand, and easy to follow.  Keep 'em coming.

  12. Ratul Monzurul
    August 28, 2018 at 17:51

    my image isn't acting like a fluid. it is getting strecthed sideways.

  13. Nguyen Manh
    August 28, 2018 at 17:51

    greatest bootstrap tutorials, thank you so much !

  14. Kali 33
    August 28, 2018 at 17:51

    Love the series!

  15. Innen sind wir alle Rosa
    August 28, 2018 at 17:51

    These Tutorials helped me a lot! Thank you and keep on going 🙂

  16. Dave Williams
    August 28, 2018 at 17:51

    Went to download the images from your link and there's nothing but folder with a readme inside… otherwise great stuff! 🙂

  17. Diogo Cordeiro
    August 28, 2018 at 17:51

    What is this theme you are using and wich syntex color?

  18. Md. Afser Uddin
    August 28, 2018 at 17:51

    very nice. thanks for your Tutorial.

  19. YoungDo Choi
    August 28, 2018 at 17:51

    Best tutorials indeed, mate! I hope the last part of the series would be coding a more advanced website from scratch using everything that we learn throughout this series.

  20. Chris Kavanagh
    August 28, 2018 at 17:51

    Well done! Thank you. . .

Leave A Comment

You must be logged in to post a comment.