CSS Logic
- Started
- Last post
- 14 Responses
- aliastime
The programmers at my new job use the hell out of classes like this...
.padding40{padding:40px;}
.padding30{padding:30px;}
.padding20{padding:20px;}
.padding10{padding:10px;}
.padding5{padding:5px;}.paddingleft40{padding-left:40px...
.paddingleft30{padding-left:30px...
.paddingleft20{padding-left:20px...
.paddingleft10{padding-left:10px...
.paddingleft5{padding-left:5px;}If this is how you're going to write your css, why not just write it inline? Am I missing something here?
- dibec0
Inline works if you have one page. Got multiple pages, your are screwed, so use classes.
- dbloc0
they must be using them a lot. It wouldn't make sense to use inline for multiple pages
- Milan0
Your "programmers" are retarded. That style is even worse than writing inline CSS. What happens if you have to change the padding from 10px to 16px? Make another class called padding16 and then update all the pages that use padding10?
- Stugoo0
What Milan said.
I worked somewhere where they used this approach and also used it for a while myself. It was so that every site was uniform and cross the dev team anyone could pick it up and use it. Ultimatley it lead to class soup which in turn spurred frustration.
div class=" padding40 marginTop10 content-block float-left" etc.
it defeats the purpose of having clean markup.
You are in turn moving your editting from the CSS to the HTML. Those classes arent semantic. Next thing you will be finding declarations .blue-link{ color:#ff000;}Send them to the CSS Zen Garden archive for a lesson in how to properly use CSS
- aliastime0
Stugoo, that is exactly the purpose. So all devs can pick it up and use it instantly. It's part of the co's 'base theme'. I'm building my first site with them using this mess and it's definitely class soup.
I was trained to keep classes to a minimum and only use inline as a rare exception. Basically, use ancestor selectors and keep the markup clean.
Oh, and this is preferred over boilerplate's clearfix
<div class="clear-div"></div> just shit seems a bit cray to me
- BabySnakes0
Facebook's css classes are close to this at times...very sad
- It is an utter cluster-fuck sometimes, the poor devs must be out of their minds having to cook with that.mikotondria3
- i_was0
that's not a good css logic, good css logic equals good maintainability.
i am nowadays using this logic : #main container .class_inside_this_container
- sublocked0
Wow, what garbage. I'd be pissed.
- animatedgif0
CSS is meant to separate the design from the markup
ANYONE doing shit like this "div class=" padding40 marginTop10 content-block float-left" is completely incompetent
Totally seems like someone who learnt web dev in the hard coded style days and never really figured out how to do CSS properly so are just replicating the old way of working in the newer tech.
- mekk0
this could make sense in a very big framework where you have to deal with "object-orientated-css"-classes.
example:
2 different boxes and no default padding and different placement, so you can just add another class to set the padding. dont't touch your base-class- You can do that a sensible way if you know how to use CSS rules correctlyanimatedgif
- vaxorcist0
that code kind of defeats the whole idea of css...
then again, with enough account staff pressure for "make it bigger NOW, the CEO wears Bifocals!!!!!!" .... and clients screaming things like "Make the logo bigger" ....I suppose some web developers descend into shit code like this.... as a form of some sort of revenge....
- vaxorcist0
did whoever wrote this code come from a print design background, did they want "it to look exactly the same everywhere!!!!!" ....
did they come from a console-video-game background, where all screens are exactly the same size?
It seems like the sort of idea-mismatch you get when somebody takes an approach based on some other tech gig and applies it to current web work....
- With such long class names I suspect it's probably from a compiler.orrinward2
- yes.... looks like output from a PERL script, etc....vaxorcist
- orrinward20
I write my SCSS using -large, -medium e.t.c suffixes but they compile to pixel values in the CSS.
It makes it very easy for Firebugging as I don't have to look at the both HTML and CSS.
It's certainly not the best way to do things but there are benefits. It doesn't really work well with responsive though!