Grow your CSS skills. Land your dream job.

Question about a Framework I am working on.

  • # March 3, 2013 at 4:48 pm

    I know by defining elements for list items and links below are not only more pure oocss because you are not relying on elements, but it is also faster to read by selector engines. I would like to put out a github of a framework I am working on, but want to know how much of a pain it would be for people to define things this way.

    I know inuit.css and bootstrap style li’s and a’s making it less typing – but I don’t think it is a good way of doing it.

    # March 3, 2013 at 7:02 pm

    This is not OOCSS. It’s just bad semantics.

    # March 4, 2013 at 8:32 pm

    I’m sorry for sounding harsh, but you do not know what you are talking about. It is good semantics based on the B.E.M naming convention and name-based scoping rules. “Elements” are not scoped to a tag but a Block in B.E.M. Semantics do not live inside the tags alone.

    Like I mentioned, selector engines read selectors from right to left. It would have to evaluate all the li and a tags. The class name soup you see on the li’s is how you define an element of the nav block. It is tag independent. This means the same code could be written in an ol, ul, dl, div, or any other block tag.

    The only disadvantage I see is having developers painfully define the elements of the nav objects block. For me its worth the payoff to keep it more pure.

    # March 4, 2013 at 10:44 pm

    I wanted to add that the popular .media object by Nicole Sullivan that popularized these principles RARELY scope to a tag, but warned against the practice.

    Otherwise it would look like this:

    .media
    {
    }

    .media img (instead of .media__body or .media .image)
    {
    }

    .media div (instead of .media__body or .media .body)
    {
    }

    It would mean that you HAD to use a div for the body, which she knew is wrong.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".