TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Ask HN : How to keep my CSS clean?

29 pointsby dan_simover 15 years ago
A lot of CSS gets written and sometimes, you just delete an HTML element without deleting the CSS bound to it.<p>Is there something that goes trough all your html (or .erb or whatever) and tell me which CSS element is unused?

7 comments

madmotiveover 15 years ago
Dust-Me Selectors (<a href="http://www.sitepoint.com/dustmeselectors/" rel="nofollow">http://www.sitepoint.com/dustmeselectors/</a>) has worked for me along with getting organised in CSSEdit (<a href="http://macrabbit.com/cssedit/" rel="nofollow">http://macrabbit.com/cssedit/</a>).<p>Best approach I've found to keep it all under control and avoid getting in a mess in the first place is to use SASS (<a href="http://sass-lang.com/" rel="nofollow">http://sass-lang.com/</a>) &#38; Compass (<a href="http://wiki.github.com/chriseppstein/compass" rel="nofollow">http://wiki.github.com/chriseppstein/compass</a>).
评论 #876992 未加载
评论 #877145 未加载
评论 #877165 未加载
billturnerover 15 years ago
Since you mention .erb, I'm guessing Rails. There was a Railscast covering this exact thing recently: <a href="http://railscasts.com/episodes/180-finding-unused-css" rel="nofollow">http://railscasts.com/episodes/180-finding-unused-css</a>
proeeover 15 years ago
I've started using the 960.gs grid system to design sites and it allowed me to reuse more style sheet code therefore reducing the total lines of css.<p>The 960.gs helps me keep my css clean because I'm able to establish the bulk of the site design using predefined grid classes as opposed to custom defined classes which are tightly coupled to a particular layout.
评论 #876928 未加载
评论 #877104 未加载
mikegioiaover 15 years ago
I never even really thought of this until you mentioned it. There's probably a ton of unused elements in my css.<p>Just found a firefox tool that helps with this: <a href="http://www.sitepoint.com/dustmeselectors/" rel="nofollow">http://www.sitepoint.com/dustmeselectors/</a>
评论 #876990 未加载
评论 #876803 未加载
dasil003over 15 years ago
I work on a Rails site with about 5000 lines of CSS. There are spidering tools and other things that you can use to scan for the existence of a class, but I think those tools are often dangerous because in most applications there are tons of pages and/or conditional content that a spider will never see.<p>So far I haven't found anything more reliable than simple grepping. This can range from completely awesome if your class/id names are unique in the codebase, to painstakingly tedious if you have generic class names that match your controllers, models, libraries and everything else. However given all the places that a CSS name could hang out, it has proven to be the most robust.
评论 #877114 未加载
cloudheadover 15 years ago
Deadweight: <a href="http://github.com/aanand/deadweight/" rel="nofollow">http://github.com/aanand/deadweight/</a> might be what you're looking for.
synnikover 15 years ago
<a href="http://code.google.com/speed/page-speed/" rel="nofollow">http://code.google.com/speed/page-speed/</a>