Throughout the years, I wrote a lot on CSS. This post contains all the resources that you should know to learn CSS from the ground up.

It will take you from the very basic to a little further. At least, these will give you a rock-solid concept of CSS.

All these posts contain source code, examples, and other necessary resources. Think of this post as a beginner guide to learning CSS.

SLHistory & basic concept
6How to change image size?
7How to style buttons?
Border
2How to add borders in an HTML table
3How to hide the scrollbar using CSS
4CSS gradient border examples & explanation
Background
2Background images size CSS
3Animated background examples
Hover
2How to change an image on hover
3How to create an image hover animation effect only with CSS?
4How to create a mouse hover HTML tooltip text?
Centering elements
1How to center an image in HTML CSS?
2CSS vertically center text
3How to center a div in HTML CSS?
4Centering anything vertically with CSS
Alignment (other than the center)
1How to align text to the bottom of a div using CSS?
2How to right-align an image in HTML CSS?
Round/circle
1How to create a circle with CSS?
2How to make a table rounded with CSS?
1Position
2How to position text over an image with CSS?
Flexbox
1Core concept on Flexbox CSS
2How to create space between flex items?
3How to reverse the column on mobile?
Scroll
1How to hide the scrollbar
Selectors
3Adjacent sibling combinator
Spacing
4Margin vs Padding (Box Model)
Lines
2How to change the hr color?
Make your hands dirty
1Two-column layout
2Three-column layout
3How to rotate text & images?
5How to create multiple-color text?
6How to make a horizontal list?

Beginner guide to learning CSS

What’s next?

After completing this course, you will have a very good understanding of CSS and you’ll be able to create small things.

If you wish to take your skills to the next level, build some real-world projects. To help you with that, I have created a list of projects that you can practice.

HTML CSS Projects

Each of the topics has its individual page. If you get stuck, you can ask questions on the individual page. If a topic is hard to explain in words, I included videos to explain it further. Therefore, you’re always welcome to ask new questions.