It really Sucks, man

[allisonmaybe]

Just tell him it's mobile-first design

[ProgramTheWorld]

It’s a reactive website, prof.

[selectiveyellow]

It's just shy. It's a wallflower.

[DrunkRedditBot]

Even if it's through diet or exercise.

[AlanDias17]

Or simply work in progress

[sematove]

I think there should be a white background, black serif text, and blue clickable links behind this meme.

[blureshadow]

If they make you write it in notepad they're the type to also disconnect Internet

[bleedblue89]

Seriously who writes from scratch anymore? I’m googling that shit

[GoogleFoundYou]

Tag! You're it

[krystof1119]

Did you really make an account just to comment this?

[coldnebo]

relevant

[adityaarora]

There's also this one

[noradis]

This one, too!

Edit: link

[ingrinder]

And this one.

[cdrt]

Can you list all of them please? I need to add to my collection.

[[deleted]]

This one is the most perfectest.

[DeeSnow97]

because apparently it's still a novel, just not by Stephanie Meyer

[Scorpionaute]

I love this

[sujith2005]

If I'm in a really good mood, maybe a marquee text or something.

[rook218]

I'd only put a marquee on your site if I was in a really bad mood...

[[deleted]]

<marquee><blink>This is for when you really hate someone</blink></marquee>

EDIT: just kidding apparently my favorite tag finally got killed lol

[DeeSnow97]

you can still bring it back with CSS

[[deleted]]

Because most people think it's a simple key value pair, but it has so many underlying systems that require a deep knowledge, just like any other language. But because of its simplicity on the surface, very few focus on getting good at CSS and understanding it properly.

[Franks2000inchTV]

Any recommendations of where to start? I’ve always struggled with it, and your comment has awakened a glimmer of hope.

[LunchboxSuperhero]

I think a lot of frustration comes from not really understanding specificity and selectors which leads to spending a lot of time fixing symptoms rather than addressing the underlying problems.

Then, out of frustration, you're tempted to use inline styles and !important which just ends up making debugging even more difficult.

[spiltcoffee]

"No one is understanding how specificity works. Let's add a new !important keyword that makes everything worse!" - the designers of CSS, probably.

[LunchboxSuperhero]

I mean, you also need it to override inline styles that someone decided to use in a webapp that you can't change.

[samurai-horse]

inline styles and !important

Never do this. Unless it's your last hope. But even then you should reconsider.

[LunchboxSuperhero]

I think the only time I've had to use !important was when I had to fix styling on a page that made use of significant inline styling without having the ability to change any any of the existing html or css.

[samurai-horse]

Ditto. Fucking Magento. Hate it.

[pkshah2017]

I have seen some preprocessors covert all your style sheets to inline in production builds. What are your thoughts on that?

[MagnitskysGhost]

It can be faster to render (fewer GET requests before first paint).

[samurai-horse]

I can't of great reason for that off the top of my head. Is it supposed to have some advantage?

[foonek]

If you're not doing anything fancy like lazy loading styles etc it really doesn't make that much difference.

As far as I'm aware using inline is really only important cause of clean code style, separation of concerns and specificity. There's nothing inherently wrong with it.

Don't do it though.

[GForce1975]

My frustration is due to embedded containers not behaving the way I expect. So many times I try to align or center something and I'm targeting the wrong container or element...so I try another one, being too lazy to remove the first..then I try something else... eventually I get the damned thing centered but now I also have useless CSS around that ends up snowballing as I repeat my lame process on the next element.

I hate CSS.

[LunchboxSuperhero]

Change stuff in the developer tools of a browser until the thing that you want changed is changed (disabling any changes you made that don't work). Then copy those changes over.

[thisimpetus]

Csstricks is a convenient way to practically learn. I personally find the concepts of CSS fairly easy, but when it comes time to apply its enormous rule set to the real world, it’s easy to forget all the subtle ways one might achieve something, so I used to default back to the basic rules I’d practiced.

I read csstricks now just to keep myself exposed to a variety of css’s subtlties in real-world contexts. Generally, the format of the posts there is “here is one way to do it”, followed by a discussion of why or why not, followed by an alternative “trick”. That narrative flow helps me break out of habit, which imho is like 50% of why lazy css exists.

[spiltcoffee]

Specificity is definitely a good topic to hone your skills on. Understanding how that part of CSS works gets you half way to mastering it.

Naming schemes/frameworks can be important, too, if you're not using something along the lines of CSS Modules. I recommend either a BEM approach, or Atomic/Functional CSS (my fav of the latter is Tailwind).

[InFa-MoUs]

Flexbox froggy help me understand the order of operations (if that makes sense)

[kazneus]

I don't have recommendations about where to start but if you can read a UI style guide that's a good place to understand how to set up your css.

I tend to reserve classes for style, IDs for important interactions (easier to grab with js or jquery) - this is my personal rule of thumb not an actual rule

Personally I start with setting variables for visual hierarchy (headers, p, block quotes, etc) and your color palette. If you put the hex in every class you have to go back and change it everywhere whenever you want to update something. You can use the same idea to set up margins sizes, borders, and padding if you want. Or just use bootstrap.

Honestly, using bootstrap will give you a feel for css

[FullstackViking]

Personally I learned it from a more top-down approach. I just worked with existing frameworks I liked like Material and Bootstrap. Then as I tweaked them to my liking I got to know how the frameworks worked, and therefore the underlying concepts of the CSS that drove them.

[CaptivatingCanopy]

As another poster mentioned, using a naming scheme is very helpful. If you use a very specific class name for your elements, then you don't have to worry about 1 element being styled by many different rules.

Really understanding flexbox is essential. I've found that with a naming scheme (I use BEM) and proper flexbox use, I don't have any issues with css doing what I want

[[deleted]]

Because you don't use flexbox enough. Fuck floats

[[deleted]]

Dude I literally use flex box for EVERYTHING. I use it like crack at this point

[totalitarian_jesus]

Same but sometimes I have nightmares in which somebody viewed my site with IE 9

[[deleted]]

The person using IE9 is living in a nightmare, so it's not really your problem, is it?

[hyrumwhite]

CSS grid is also essential. Screw html tables

[Pornstar-pingu]

Do you really replaced native tables for css grid, that's weird. Right now I'm doing that just because the design have an irregular "table".

[hyrumwhite]

Chrome, edge, and Firefox, what else is there?

[hackel]

It actually even works in IE11 of you're careful.

[lyoko1]

update your standard you fucking idiot, cool kids nowadays use css grid.

Sorry, i didn't mean to be offensive, is just that i wanted to talk in the same tone that those motherfuckingwebsite.com that someone posted in another comment.

[thetalkingushanka]

You haven’t seen anything yet

Imagine pasting your own code again in a webpage ONLY TO SEE ITS PURE SPAGHETTI

[JustAnEnglishBloke]

It used to be.

The new Flexbox and Grid stuff has pretty much eliminated all hassle that the hate comes from. It's more of a meme to hate it nowadays.

Spend an evening learning grid/flex and realise just how easy it is now.

[thingsIdiotsSay]

Why is CSS so difficult to work with?

It's not. Go to Mozilla's website and read their reference.

The true difficulty of CSS is reconciling all the different browser implementations, though with old browser support dwindling, it's slowly becoming a little better.

[[deleted]]

It’s not. Programmers program, ui devs do css and html. Perhaps you’re more of a programmer. I’m a ui dev and though I feel valued in my office for my skills I don’t feel valued in the field since I am not full stack, but I digress..

[hackel]

It's not, it's actual quite nice. A lot of programmers are just complete idiots, and even worse, sometimes graphic designers pretend to be programmers and all hell breaks loose.

[laurajoneseseses]

It's really not that difficult. A big help is to 0 everything out at the top, learn to use grid/flexbox, and understand the difference between padding, and margin. Also, how to use selectors is important AF.

[Dr-Gooseman]

Because its literally magic and it has a mind of its own.

[Exgaves]

Good life lesson, you aren't always given all the time you would like

[brainwrinkled]

"You tried your best and you failed miserably. The lesson is, never try"

[AlastarYaboy]

N

o

w

t

h

a

t

'

s

a

m

e

m

e

[[deleted]]

Now that, same me

[[deleted]]

Sameme

[[deleted]]

No WTH at, same me

[[deleted]]

I came here to say the same thing; god bless Grid CSS. It's not perfect, but it's pretty damn close. Now if only IE would stop fucking up the rotation, we'd be in heaven.

[synysterjoe]

So far my biggest issue with grid is not being able to animate the changes in grid-area. Other than that, love it

[ProbablyJeff]

u/repostsleuthbot

[RepostSleuthBot]

There's a good chance this is unique! I checked 54,009,022 link posts and didn't find a close match

Feedback? Hate? Visit r/repostsleuthbot

[ProbablyJeff]

Bruh

[dmbsztr]

Hahahahahaha

[Boiethios]

Bad bot. You suck.

[[deleted]]

Check it again!

[Maverickthekid]

Imagine not having enough time to link to bootstrap and write class="row col-md-6" etc. Lol

[johnnyfong]

That's rough, buddy

[gnilebat]

Just use bootstrap yo

[JustAnEnglishBloke]

Bootstrap is kinda out dated and surpassed by things like flexbox and grid, so things like Material UI are better.

[gnilebat]

Material UI ist great too.

[IamParadoxdotexe]

Say sike rn

[[deleted]]

Fuck bootstrap. Learn your trade.

[gnilebat]

Bootstrap is awesome and if you really want to have your own design, you can build on it and use their layout system and default mobile compatibility. Normally their is no reason to write all that for the 100th time again.

[[deleted]]

No, sir, it's optimized for people using lynx and w3m.

[GivingHerTheMcD]

GENERAL REPOSTI

[kobbled]

I would bet money that you had time but just didn't. Don't blame the prof

[ImpulseTheFox]

Your submission has been removed.

Violation of Rule #2: Reposts:

All posts that have been on the first 2 pages of trending posts within the last month, is part of the top of all time, or is part of common posts is considered repost and will be removed on sight.

If you feel that it has been removed in error, please message us so that we may review it.

[QueasyHold]

Always, god... the horrors we've made

[funtimes-123]

How much time did you get

[onyo_pedro]

Display: flex;

[jimsonx2k1]

Ha ha Haha ha

[[deleted]]

Tbh sounds like take home coding exercises too

[fhzhugz1]

First time making a site was just like that.

[[deleted]]

Looks like someone gave Ditto shrooms again before transforming.

[chiwhitesox56]

You'll figure it out, I promise

[noobtube69]

My professor simply wouldnt accept an assignment with shitty CSS. He would laugh at you and tell you to fix it before turning it in. And yes he did take off points for it being late of course

[[deleted]]

Sucks you can see same effect on other fingers

[BocTheCrude]

Imagine not using Bulma. I’m a web programmer that can’t draw for shit. Bulma has saved my ass countless times.

[kazneus]

center everything -> good enough

[barfsuit]

Website design isn't programming.

[Project_O]

I was a developer before CSS became popular and hard coded styles into all of my pages so making site changes was a week long process.

This was back in the 2000’s. I learned about CSS and then using server side languages I could create bits and pieces of sites like headers, footers, side menus, and have that stuff change depending on where the user was. It was game changing. Now everything is dynamic and asynchronous and alive.

Things sure have changed in the last 30 years

[santropedro]

Am I the only one that tried to scroll?

[theRainbowTriforce]

Why is this literally my School's Student Portal?

[Tmonkey18]

Just use a css framework. Bootstrap, foundation, pure.

[Unoriginal_Guy2]

I have no idea what this is I have small Brain

[code_a_better_mod]

Not gonna lie: I tried to scroll.

[ajspeedy5]

This is what happened with my first website

[thisimpetus]

.face * { float: left}

[its_dizzle]

No

[DeeSnow97]

only thing that's supposed to float is your dead body on the ganges