I finished the HTML/CSS course, now what?

Hi! I finished the HTML/CSS Responsive Web Design course and I really enjoyed the process. I think I learned a lot considering prior to taking this course I had only knowledge of html from my school days circa 2000, but I still have a lot of “gray area” understanding. I need some help figuring out if I should keep exploring HTML/CSS or if I am ready to move on to the next course.

I could easily follow the FCC directions throughout HTML/CSS to create all the projects, but I don’t really know what a flexbox or a grid is or how to arrange flex items and grids within a “viewport” to create a responsive page. So, where do I go to figure that out? Is there a book I can order that will show me these things? Or do I just accept my fuzzy understanding and move on to the next course?

I tried looking at the FCC youtube and some non-FCC beginner-coding pages, but it’s all kind of unclear to me as to what I am learning and what I should be learning. I am a teacher, so clear objectives, essential questions, and scaffolding lessons are my jam; I feel like all the things I am getting in my code learning are all tangled up without clear structure. Any help in sighting a clear path to structured learning is much appreciated!

HI @anneclaiborne,
Just to clarify, are you saying you did not do the Certification Projects in the (New) Responsive Web Design section?

If this is the case, that is where you will learn and solidify flexbox and or css grid.
Build these projects and look for ways of implementing flexbox or css-grid into them and even try implementing other things such as a button that has simple action with Javascript.
As far as how to do this, just search your specific question on Google. More than likely you will find your answer on StackOverflow, MDN, freeCodeCamp, or w3schools.

That being said I would suggest building a few other projects besides these and continue to use things previously learned in html & css, eg. variables, flexbox, css grid, animations, and more.
These extra projects can be performed on the side while at the same time you move on to the Javascript portion.
But I would not move on to Javascript until you have completed the (New) Responsive Web Design section Certification Projects.

Hope this helps.

Thanks,
Hal_Jordan

Thanks for your input, Hal_Jordan. I did complete the Certification Projects and have the certificate complete, but I still don’t feel like I have a very solid understanding of these things. The certification project requirements were easier than the lessons along the way. For example, I could not create a magazine layout and create a CSS grid without looking back at how that project was created through all the steps. The certification project did not require using a grid and I don’t really understand how to create one from scratch. Should I be able to do that?

Like you suggest, I would have to look back at the lessons on flexbox and grid in order to put them all together, or google for how to put those things together. But when I search for coding help, there is such a tangle of websites of varying usability. Do you recommend a book or an easy-to-use online resource that you think is very clear?

@anneclaiborne I do love books, but when it comes to learning css such as flexbox and css grid, the best way to learn is by trial and error building projects and referring to cheat sheets for these.
This is what I find helps me the most.
Check out the following links:

Click here for Flexboc => Flexbox - The Ultimate CSS Flex Cheatsheet (with animated diagrams!)

Click here for Flexbox => A Complete Guide to Flexbox | CSS-Tricks - CSS-Tricks

Click here for Flexbox => Learn CSS Flexbox in This Crash Course

Click here for Flexbox => Flexbox - Learn web development | MDN

Click here for CSS Grid => https://www.freecodecamp.org/news/css-grid-tutorial-with-cheatsheet/

Click here for CSS Grid => Learn CSS Grid by Building 5 Layouts in 17 minutes

Click here for CSS Grid => CSS Grid Layout

I have also attached my favorite flexbox cheat sheet I use the most, which I downloaded from someone else and I added to it myself in photoshop.

I hope this helps.

Thanks,
Hal_Jordan

This is very helpful, thank you! The diagrams on your cheat sheet are exactly what I needed to visualize what is happening with the code, that has already helped immensely. I am reading through the other links now, thank you for curating them for me.