I have a hard time putting HTML and CSS together on my own

1

I’ve done the HTML course and CSS course (plus a lot more on external sites) but I always feel like I have too guess on how to get an element too where I want it. I already know some jQuery, js, node due to some udemy courses but I feel like i’m having the most trouble with CSS. I can’t get the layout how I want it to be. I finished the HTML / CSS / Bootstrap section yet I still feel like I couldn’t put them all together on my own to build a okay looking website (that’s coded correctly anyway). Also I don’t know if this is the right section to ask for advice

2

I usually look on just random websites to see what they look like for inspiration. Work through it slowly, as any progress helps. Maybe add colors, images, anything that gets you closer to completion. This can really help shape the HTML and give you idea’s.

3

Cloning websites or coding from an image has been helpful to me. I would look up how to do some things and would read through documentations and experiment.

4

Use inspector to preview any changes you want to try.

5

Like others have said try to replicate some sites you like, or just start your project and try to figure out one thing at the time. Here are some reusorces for HTML/CSS:
Learn to Code HTML & CSS - for me one of the best ones
http://learnlayout.com/
Learn CSS Positioning in Ten Steps: position static relative absolute float

And some video courses:

2 Likes
6

You just gotta do it.

I would also say that I learned a lot once I sat down with a book on CSS and started actually learning how to do things instead of cut and pasting from SO and tinkering until things kinda looked OK. CSS may be boring but it’s incredibly powerful.

7

If I understand your question correctly, I’d recommend learning Flexbox. It’s native in CSS now (you can use it without having to link to a library) and you could learn it in a weekend. There are plenty of free tutorials for Flexbox on the web, I would recommend:

http://flexboxfroggy.com/ or https://geddski.teachable.com/p/flexbox-zombies

Once you’ve got the hang of Flexbox, it’s pretty straight forward to knock up layouts for your apps.