While learning to code, there is a ton to learn, and of all of those things, CSS is not all that exciting. That said, a page that has been nicely styled makes you feel a whole lot better about your output. Below are some resources that I found beneficial in moving me along.
1.) Bootsnipp (https://bootsnipp.com/) Starting out, it’s not wrong to rely on Bootstrap. After all, there is a reason it is so widely used and allows you to quickly put together an application that doesn’t look terrible and is responsive. I just didn’t want it to be the only tool I had. Bootsnipp is a great place to start experimenting on your own. It’s a giant collection of Bootsrapy things where people have added custom CSS and javascript to make the components to do a whole lot more. If you want something to work off of or are looking for inspiration its a great resource.
**2.) CSS-Tricks (https://css-tricks.com/) ** I really like this site. This site is loaded with great articles that cover pretty much everything relating to styles. Initially, I had trouble with positioning elements. The labs were good, but I needed something that would explain things in minute detail. Also, I really wanted to get on to the ‘cool’ stuff, so I gave that part short shrift. The below two links really helped me with this.
a. https://css-tricks.com/centering-css-complete-guide/ This link is basically an if statement for how to center an element. If you want that element to get in the middle, follow the if statement until your muscle memory takes over.
b.https://css-tricks.com/absolute-relative-fixed-positioining-how-do-they-differ/ Another good link for explaining positioning. One thing I really liked about it was that the author tells you when stuff like float and top will not work. W3 has a lot of tutorials, but, I found the examples were too simple to really be useful. c. http://www.barelyfitz.com/screencast/html-training/css/positioning/ If you are still struggling, check out this link. It looks kinda crummy but what makes this page great is that you have a group of divs that change as you move through the ten tabs. It’s straightforward to toggle back and forth to make yourself clear on the differences.
For anything else CSS related just search on CSS tricks. I recently started working with SVG files and found a ton of help there.
Good luck!