Slide 3

Latest Updates

In a world of infinite possibilities, Ability is everything. We develop Website & Mobile app for Business.

CSS grid cards with animated hover effect | HTML/CSS

(Source Youtube)

Learn to code with a free 7-day trial to Team Treehouse: https://treehouse.7eer.net/c/1296848/228915/3944 In this video we will build some responsive cards in CSS using CSS grid! Get the source code on GitHub:

Learn to code with a free 7-day trial to Team Treehouse:

https://treehouse.7eer.net/c/1296848/228915/3944

In this video we will build some responsive cards in CSS using CSS grid!

Get the source code on GitHub: https://github.com/thecodercoder/cards-css-grid

0:00 - Intro

0:30 - Set up files & folders

1:27 - Add boilerplate HTML

2:26 - Loading Google font

3:16 - Add HTML markup for cards

6:30 - Start adding SCSS styles

9:30 - Plan grid template in Adobe XD

12:13 - Add styles for mobile cards

23:50 - Create additional cards in a grid

26:11 - Add styles for desktop cards

30:48 - Give cards different images and text

32:52 - Add breakpoints to make grid responsive

42:23 - Adding hover state on cards

_____________________________________

WANT TO LEARN WEB DEV?

Check out my courses:

???? Responsive Design for Beginners: https://coder-coder.com/responsive-design-beginners/

???? Gulp for Beginners: https://coder-coder.com/gulp-course/

_____________________________________

RECOMMENDATIONS

???? My Gear -- https://www.amazon.com/shop/thecodercoder?listId=1LMCKGUTMVYXD

???? My Favorite Books -- https://coder-coder.com/best-web-development-books/

???? My Favorite Courses -- https://coder-coder.com/best-web-development-courses/

_____________________________________

FOLLOW CODER CODER

Blog -- https://coder-coder.com/

Twitter -- https://twitter.com/thecodercoder

Instagram -- https://www.instagram.com/thecodercoder

_____________________________________

#cssgrid #css

Why you’re not progressing (and how to fix it)

Blog

01-26-2021

Why you’re not progressing (and how to fix it)

After seeing thousands of designers go through our courses, there's something I've come to notice that makes or breaks a designer. A well-rounded designer who is pretty

Slide

From a small room table to large meeting rooms

We’re working with companies of all sizes ranging from startups to large scale business industries! We have extensive experience working with companies in Canada, USA and global to help them build a great website and effectively improve their ROI.

Slide