• Bittle Tobby Lables (unregistered)

    This makes me feel unwell.

    It takes me back to a traumatic time in my career where I tasked myself with the ambitious project of implementing a company look-and-feel on the application so as to educate my cow orkers to not to do it like this ...

    I still feel the pain.

  • Industrial Automation Engineer (unregistered)

    One reason could be that it allows a (perceived) flexibility. ( I did not say it was a good reason..., or even a valid one)

  • Dennis (unregistered)

    "Best practice is that a CSS class should define the role, not the appearance. So that class might be better named "validationError", for example. A class will frequently bundle together a bunch of stylesheet properties into a single, meaningful name. That's the ideal approach, anyway."

    AKA the opposite of should-be-a-bad-joke-but-isnt frameworks like Tailwind CSS.

  • (nodebb) in reply to Bittle Tobby Lables

    I can think of a possible reason, which doesn't justify what we have in the end, but may have started this descent into the abyss: the objective was to have a uniformly styled website, in which certain elements are supposed to have the same font, color, etc. If you have a page and on it, content types a, b and c are supposed to be red, it's tempting to group stuff the way they did here.

    Addendum 2022-07-28 07:34: I didn't mean to reply to your comment - clicked by mistake

  • Teodor Potancok (github)

    Tailwind is designed to be used with a component framework. You set the style once and then use it everywhere, like this (with a shorter tag obviously):

    const Underlined = (props) => {
  return(
    <span className="underline decoration-2 decoration-red-500 dark:decoration-blue-500">
        {props.children}
    </span>
)}

//and then...

const IndexPage = () => {
  return(<p>The Daily <Underlined>WTF</Underlined></p>)
}

    Addendum 2022-07-28 07:46: This is a reply to Dennis

  • (nodebb) in reply to Mr. TA

    Except you can combine classes on a single element, so this insanity is just... insane. You could have e.g. <div class="info label"> and then have a rule for .info, a rule for .label, and a rule for .info.label. This way you could later style <span class="info"> with the same style you used for the label (e.g. the text colour) without giving it all the extra styles needed for an actual label (borders, background colour, &c.).

  • Daniel Orner (github) in reply to Teodor Potancok

    I don't really understand why Ruby on Rails started touting Tailwind as its go-to CSS framework, precisely for this reason - Rails is trying to not use component frameworks, which makes Tailwind a... really bad choice?

  • (nodebb)

    Few things are as annoying and such a waste of time as "carefully" designed CSS files with "meaningful" classes ... if you are in charge of changes to several applications written at different times (thus using the newest and greatest framework of the week at the time each of them was started) by a different frontend degenerate, sorry, developer. So what's the class for a warning text in this particular project? All I bloody want is to have the darn text red! And how do I add some vertical whitespace after this so that this bloody, sorry, cool graphic bazdmeg doesn't run into the text above it? Oh! Screw you!

    ...



  • Yikes (unregistered)

    So the WTF here must be over-specifying CSS labels, because if the coder had to specify all those labels, then this seems like a fairly efficient way to assign styles to them. That is, why repeat the color or font-weight 30 times when you can specify them in a single place?

  • css.d/ (unregistered)

    The real WTF is not splitting this into individual files, one for each formatting. Helps with diffs in version control. Better yet, one dir per style. In this dir, one file per class which should have that style.

  • (nodebb)

    My headcanon is that the developer stored his CSS in a database table like:

    CREATE TABLE styles (CSSClass varchar(50), PropertyName varchar(50), Value varchar(50), PRIMARY KEY (CssClass, PropertyName));

    Any time they wanted to apply a new style, they added it to the database. A primitive script went through the table and generated the CSS file one property at a time.

    The bad side of this came out when it was easier to add new CSS classes than to find an appropriate one.

  • Randal L. Schwartz (google)

    My guess is that this started with a codebase that was riddled with inline styles, like <h1 style="color:blue;text-align:center;">This is a heading</h1>, and someone was tasked with making this "more modern with CSS" without specific guidelines. So, every inline style was replaced with a class, and the class contains the original inline style.

  • (nodebb) in reply to Ondřej Vágner

    Oh yes, no argument, this is a WTF alright. I meant that's what I think the reasoning was in their mind, what prompted them to go down that route.

  • Celina Duran (unregistered)
    Comment held for moderation.
  • NotAThingThatHappens (unregistered) in reply to Jenda

    Strongly worden, but valid points. (depending on context)

  • Just another Embedded Designer (unregistered)

    The biggest bugbear to me is that anyone is doing FIXED screen size work and using pixels not points for text size so on many monitors, the text gets harder to read without user having to zoom the text

  • (nodebb) in reply to Bittle Tobby Lables

    This makes me feel unwell.

    Agreed. It's just terrible, as it takes a good principle and uses it to do something significantly worse than pretty much everything described as bad practice. I want someone to show this stuff to one of the groups of CSS compiler makers and ask that they support generating things in this style just to watch the fireworks of condemnation.

  • farhankanju (unregistered)
    Comment held for moderation.
  • WTFGuy (unregistered)

    @Randal L. Schwartz IMO you got it exactly. Somebody totally new to CSS when it was the latest hotness was tasked to apply CSS to an existing site. They "learned" to see CSS this way, orthogonal to CSS's original design intent. And once they (or anyone else) are mentally stuck in Bizarro World where left is up and up is east and south is clockwise, all one can do is continue writing code that fits that contorted defective mental model.

    Which is what actual developer training, competent developmentr management, deliberate mentoring, coding standards, and code reviews are all meant to accomplish. Which is why such a tiny fraction of shops uses even one of those techniques, much less all five. And doubly so for web frontend work.

  • WilliamF (unregistered)

    I’m not sure there’s even really a WTF here. All CSS is bad. It’s effectively impossible to not write WTFs with CSS.

  • farhankanju (unregistered)
    Comment held for moderation.
  • (nodebb)

    so dope

    Addendum 2023-11-27 04:15: Embrace the sweetness of your Quinceañera with our huggable Quince Bear. Dressed in celebration attire, this teddy bear becomes a charming symbol of the joy and innocence of turning sixteen. Share quince bear the love by gifting this adorable bear to the quinceañera, creating a cherished memory that lasts beyond the festivities.

Leave a comment on “Classical Solutions”

Log In or post as a guest

Replying to comment #:

Log Out

« Return to Article