Survey for CSS learners!

Webweaving
1

Hey all, I’m planning to submit an ‘intermediate’ CSS tips column to the Good Internet magazine, but since I’ve been doing CSS off and on pretty much since it first appeared, I’d like your help in identifying what actually is ‘beginner’ vs. ‘intermediate’.

This question is for people learning CSS for the first time only; folks who are experienced CSS slingers please keep quiet :)

Question 1: what are the first, beginner CSS things you learned to make your website look nice?

Question 2: what are the next CSS things you’re trying to learn but might be finding tricky?

Question 3: what are some things you wish you could do but aren’t sure how to ask the question to find the right CSS for it?

5 Likes
2

Oh wow, it’s my time to shine :star_struck:

Honestly, I think just where to replace colors. The root thingy and the var(–whatever) throughout the css. And also border thickness, variants, roundness… Those are the easiest to tweak without breaking anything by accident and also making the website look a little less “templatey”.

So much stuff haha
Lately I really wanted to apply some font effects like making the text wavy or shake but I couldn’t figure it out (the noat.blog has awesome examples of this!). Also I’d love to make like a collage using html/css to overlay images and text but that’s not happening any time soon…

That’s a hard one… It’s usually stuff I see in other ppl’s stuff, think for a second but then forget about it. I’ll look back into a few faves to see if something specific pops up, bc it’s so vague it’s hard to remember.

2 Likes
3

Thank you! I’ve added that to my notes while I figure out which subjects to tackle first.

4

I’d say things like using “var” for colors and images (not sure if it can be used for anything else), the bare basics of flexbox, and general classes - stuff like making boxes and centered text. I also learned super basic responsive design.

I’m still trying to learn the full power/use of ::after, ::before, and ::not, as well as anything similar to them in terms of use. Making full use of flex box is another, since I feel I’ve just barely scratched the surface. Also, making sticky elements play nice with flexbox. I know what I want to do is possible (at least, I’ve seen other sites do it), I just can’t seem to get it to work >>

Bonus round: at this point, I’ve never made an element that was rotated at a particular angle. But I probably could learn it with some trial and error. So I’ll put that at a similar level as the above.

A lot of what I’ve seen on other sites! For example, Dragon Cave has “boxes” with edges that look like torn paper, but they’re able to stretch infinitely. How do you do that? Or other more “decorative” borders that are still repeatable?

Perfect alignment? Is there a way to force two elements to take up the “same space” so they appear aligned on the page, even when in different divs?

More complicated responsiveness and accessibility in general. I (and others) often feel forced to simplify designs for the sake of these aspects, but there must be a way to have intricate, intresting designs also be mobile friendly and accessible. Though, I understand if this is going beyond “intermediate” CSS and into more advanced CSS.

You know how some sites have it to where the background changes the further down you scroll? Maybe something like making it look like you’re going deeper and deeper into the ocean. HOW. THAT’S SO COOL. And is there a way to ensure that adding more content to the page won’t completely break the effect?

Sorry if those are rather spesific ^^; I could easily make threads on most of those. But it was the best way I knew to answer this question, since at this point I wouldn’t even know what code to call upon.

5

I started learning CSS literally this weekend, so here’s an ultra newbie perspective:

Question 1: what are the first, beginner CSS things you learned to make your website look nice?

Changing the color of the background and the headings. Also changing the size of the headings and center/left/right aligning text.

Question 2: what are the next CSS things you’re trying to learn but might be finding tricky?

Figuring out how to make a functional style sheet tripped me up a bit. Also, remembering to use one. I’m used to just typing out an entire page, HTML and all, but inline CSS style changes are woefully inefficient. I know having a style sheet will make my life easier in the long run, but the urge to just define color and size every time I type an h2 tag is strong.

Question 3: what are some things you wish you could do but aren’t sure how to ask the question to find the right CSS for it?

Fonts. How do I change fonts? Where do I find fonts? Is there a “cheat sheet” of recognized font names like there is for recognized color names?

I might figure this one out by the end of the week, but right now, that’s my next big question pile.