cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - ActiveLovehtmlicon-new-collectionicon-personicon-teamlog-outoctocatpop-outspinnerstartv

Posts tagged bem

Adventures in BEM and Responsive with SASS

Objective

I've been trying to wrap my head around how to apply BEM and the pros and cons of using it (or something like it). For those of you that are unfamiliar, BEM (stands for Block Element...

Expressive BEM with Sass: a different approach

Disclaimer: This is just a thought about a different approach. I am by no means saying that this approach is better than anything else. :)

At first, I was intending to write some long-drawn blog...

Expressive BEM with Sass Part II: A first draft of mixins

Hey there! Since writing about how you can write BEM a different way using Sass, the idea has gained some attention (thank you all so much, for all your feedback and motivating comments!).

Because...

Advanced BEM with React components

The past week or so I've spent quite a lot of time putting together react-tabbordion component. It is my first contribution to npm and also the first time I've managed to put up WebPack and...

#1. BEMIT, Purify and how to add SVG's to a Web Page

It's 2016, and we're setting it off with something we call Front-End Frulle here at Comeon! Every Wednesday we'll eat breakfast and talk about front-end this and that. So without no further ado,...

BEM classes, could we use custom elements/x-tags instead?

A system called BEM has been invented to avoid the CSS selector mess which seems to be the rule more than the exception in many modern websites. The way that the system works is to view HTML...

BEMantic: DRY Like You Mean It

Tim Baxter’s recent A List Apart article, Meaningful CSS: Style Like You Mean It, has once again re-ignited the debate that front-end developers who prefer to take an object oriented approach to...

BEM vs Mixins

A couple a days ago someone in my team raised the following questions: "To add a new version of a button, should we use BEM modifiers or create a mixin to add the basic styles of the button to...

On BEM

Introduction

A lot has been written on the topic of writing modular, re-usable and scalable CSS. This is my take on it. In this short post I'm focussing on the BEM methodology because from my...

Elephant - Daily CSS Images 02

Challenging to make an elegant elephant! I knew it had to be stylised in order to keep it simple, but I wanted it to be less grotesquely cartoonish than yesterday's effort.

After a quick image...

An introduction to CSS Methodologies: Naming Conventions and File Structures

CSS Methodologies are structured ways of writing and organizing your CSS and HTML. Adopting a standard convention has benefits across small and large projects, but choosing the right one can be...

Doing BEM right with SCSS / LESS

We have many ways of selecting BEM elements with SCSS and LESS.
It is also all too easy to abuse BEM when using a CSS preprocessor.

To my knowledge, there are two types of frontenders:

The ones who...

A sane way to set your web project colors

I am writing this article with the intention of sharing with others what i have learned working on various projects as a front-end developer. I'm sure most of you will read and nod the various...

BEM with CSS/SCSS

BEM (Block Element Modifier) is a highly useful, powerful, and simple naming convention that makes your front-end code easier to read and understand, easier to work with, easier to scale, more...