---
title: "Discussion on \"DRY HTML or DRY CSS? 🤯\" | Hashnode"
description: "Discussion on \"DRY HTML or DRY CSS? 🤯\". Till now I have seen and worked on many projects and one term that I came across frequently is DRY i.e. Don't Repeat Yourself in code.\nLet's take a look at what is DRY and why is it important.\n🔬 What\nAs the abbreviation suggests, Don't repeat yourse..."
url: "https://hashnode.com/posts/dry-html-or-dry-css/5c94e11e1e0fb7505b9b1093"
---

[Feed](https://hashnode.com/feed) /

Discussion

# [DRY HTML or DRY CSS? 🤯](https://blog.pankaj.pro/dry-html-or-dry-css?utm_source=hashnode&utm_medium=feed)

Till now I have seen and worked on many projects and one term that I came across frequently is DRY i.e. Don't Repeat Yourself in code. Let's take a look at what is DRY and why is it important. 🔬 What As the abbreviation suggests, Don't repeat yourse...

Mar 22, 2019 · blog.pankaj.pro  
Read the article

-   [#javascript](https://hashnode.com/tag/javascript)
-   [#frontend](https://hashnode.com/tag/frontend)
-   [#css](https://hashnode.com/tag/css)
-   [#html](https://hashnode.com/tag/html)
-   [#html5](https://hashnode.com/tag/html5)

## Written by

[Pankaj Patel](https://hashnode.com/@pankajpatel)

@pankajpatel · Berlin

  
[View profile](https://hashnode.com/@pankajpatel)

Blog, Tech, Photography etc.

I am developer from India currently based in Berlin, Germany. I am very interested in Design, though I don't design 😉 I take care of it while making my apps. Photography, videography and having random conversation over beer are my activities of spare time. Timelapses and hyperlapses make me wonder all the time 😊

## Responses 2

Markdown supported · ⌘↵ to post

[Richard Uie](https://hashnode.com/@RichardUie)

[Mar 24, 2019](https://hashnode.com/posts/dry-html-or-dry-css/5c94e11e1e0fb7505b9b1093/comment/5c97dbd72b0e27997ad3c84c)

Almost without exception, I find it dead simple to keep HTML DRY with either Java or PHP, using the Composite View pattern. 'Tis exceedingly rare that I find cause to _wet_ my HTML.

On occasion, I specifically choose to ignore my CSS validator and be intentionally less DRY with CSS in order to pander to the less machine-like aspects of me and any other humans on my team.

I may be less DRY with CSS in order to promote a looser coupling of HTML subviews. This motive is especially relevant when there is uncertainty about the ongoing evolution or even existence of some subviews.

I ain't sayin' I recommend going extremely unDRY with CSS, but I am willing to repeat a style property (or six) for the sake of visually organizing the properties according to tags (rare), classes (less rare), or ids (least rare). Over time, I may elect to refactor the CSS declarations to make them DRYer, but not always.

Less DRYness in CSS is especially true of late addition elements to long-established pages or temporary elements that I know beforehand will have a very short lifespan.

I take my HTML very DRY, like my martinis. My CSS is shaken and has more vermouth.

[Mihai Deta](https://hashnode.com/@mihaid)

[Mar 23, 2019](https://hashnode.com/posts/dry-html-or-dry-css/5c94e11e1e0fb7505b9b1093/comment/5c965e35c5c8c901317c781c)

well... interesting... but i don;t think you offered enough information on this methodology ... I'd go for BEM for css, its usefull when you use sass or less, it keeps your classes organized. But DRY on html... so you;re telling me i should make a template for every element i need on a page? NO! i won't do that. i don;t want to make my application harder to read/modify. But i think this DRY thing is usefull but you have to determine what arhitecture your application will have before using it.

NOTE: i know this isn;t important, but, when using ems or rems, write the fallback for them in pixels, just for older browsers, antic ones and maybe safary

[Pankaj Patel](https://hashnode.com/@pankajpatel)

[Mar 23, 2019](https://hashnode.com/posts/dry-html-or-dry-css/5c94e11e1e0fb7505b9b1093/comment/5c965e35c5c8c901317c781c#reply-5c96798d84f88cb846bf475a)

Thanks for your feedback. These days I am trying to step away from LESS, SASS and moving more towards PostCSS. And BEM, OOCSS or similar structure is very powerful from the maintenance perspective, though I prefer writing small CSS class-names.

Along with that, the post was written from HTML perspective as well. As these days components are more common, the example is about Component approach with web components where thinking in terms of components will make sense to have a template for app-specific components rather than elements.

Regarding the use of `em`s; can not fallback to the pixels as the value of em is dependent on the parent element's font size. For `rem`s, the CSS processor like LESS, SASS or PostCSS takes care of that.