Responsive Cards Using CSS Grids

Download Source Code :
www.codingarti...
-----------------------------------------------------------------------------------
❤️Get in touch:
Email: [e-mail]
Website: codingartistwe...
Instagram: / coding.artist
-----------------------------------------------------------------------------------
🎵Music:
Track: Floral Nights - Artificial.Music [Audio Library Release]
Music provided by Audio Library Plus
Watch: • Floral Nights - Artifi...
Free Download / Stream: alplus.io/Flor...
Intro Music:
Track: JPB - High [NCS Release]
Music provided by NoCopyrightSounds.
Watch: • JPB - High | Trap | NC...
Free Download/ Stream: ncs.io/jpbhigh

[@searrell4508]

How do I add this to an already existing set of Web pages with its own body already set up? As when I add this in to the site I'm messing around with and making, it breaks everything and everything gets blacked out other than the cards on the site

[@norvusordoseclorum]

Thank you so much for making this video it's excellent quality. I'm just wondering how do I stop the images from going very wide and too tall?

[@amur619]

play with the width and height

[@dann2758]

Thank you so much

[@studprogaming4948]

without media tag how is this responsive? 😕

[@CodingArtist]

With Grid Layout. No media queries required here.

[@studprogaming4948]

@@CodingArtist ok thanks 😊

[@klaasjanssen644]

thx for this tutorial

[@CodingArtist]

Welcome 😊

[@lovnyweb7482]

thank you for your videos 🙏 thanks to you I created my first youtube channel in html and css only 😀.

[@Ben-gz5ev]

I like your channel, very good

[@kodeeshwarar3016]

Your video content very nice bro

[@hogvarts]

Cool ! Tell me what font is used in vs code ?) Thanks !!!

[@CodingArtist]

It's Poppins.

[@hogvarts]

@@CodingArtist Thank you so much ! I tried it, but it's a pity that the small indentation between dots and other symbols (

[@polylyfeee5869]

the css file is nothing but a link to the web

[@loss2570]

what should I do if the images and cards are all different sizes?

[@lex8699]

put the img inside of a figure, and add some width an height to figure and the img put it 100%

[@LouisaWamvs8457]

Thanks for helping in web blog project.🧡💛💚💙💜❤🤗

[@romeno29]

My cards don't go to horizontal when page is full screen, any sugestions?

[@CodingArtist]

It's hard to say without checking the code. However you can download the source code (link in video description) and compare with your code. Or else you can mail me the code so I can check.

[@kevinvigi.mathew6350]

Epic help,tysm

[@MeigetsuHiisOka]

nice !

[@ptilu2195]

I don't find the source code on your website

[@CodingArtist]

Use the search button on the website and enter the video name.

[@gungde_2169]

My image wont fit with width: 100%, how can i fix it?

[@aayushdhakal6755]

same problem... any solution for that?

[@Michel2003g]

set it min-width instead of just width this will force it to 100%

[@cagatayakar1282]

i have a question. Lets say you want to put the last card in the middle. How can you do it ?

[@rybalchenkofamily]

change the html order would be the easiest way.

[@100XPercentX]

How do you control the vertical spacing

[@CodingArtist]

With grid-gap or grid-gap-row

[@vaishnavraj8703]

cant find the source code !!!

[@CodingArtist]

You have to serach using the search bar on website.

[@dhruvgupta5658]

Source code ? There's only a website that leads to a youtube channel

[@CodingArtist]

Link in video description

[@dhruvgupta5658]

@@CodingArtist ik dude , but the problem is it just lead to your youtube

[@CodingArtist]

Scroll down. There is a button called 'Download code'.

[@dhruvgupta5658]

@@CodingArtist okay I found it , btw I need a help , how can I make the image round

[@CodingArtist]

@@dhruvgupta5658 Try this: .container{ clip-path: circle(50% at 50% 50%); }

[@anshulrj]

Maybe Last

[@lucaspiputto]

First