# Dynamic Selectors

DevFeed: [Dynamic Selectors](<https://devfeed.tech/articles/dynamic-selectors-29500.md>)

Original publisher: [Read original article](<https://philipwalton.com/articles/dynamic-selectors/>)

Published: 2013-02-20T22:22:24Z

Content type: tutorial

Language: en

Sources: [Philip Walton](<https://devfeed.tech/sources/philip-walton.md>)

Topics: [selectors](<https://devfeed.tech/topics/selectors.md>), [CSS](<https://devfeed.tech/topics/css.md>), [Sass](<https://devfeed.tech/topics/sass.md>), [Framework](<https://devfeed.tech/topics/framework.md>)

Tags: [component](<https://devfeed.tech/tags/component.md>), [css](<https://devfeed.tech/tags/css.md>), [legacy](<https://devfeed.tech/tags/legacy.md>), [legacy-code](<https://devfeed.tech/tags/legacy-code.md>), [sass](<https://devfeed.tech/tags/sass.md>), [selectors](<https://devfeed.tech/tags/selectors.md>)

## AI overview

This tutorial explains how dynamic selectors and Sass variables can let CSS libraries use configurable component names, reducing selector conflicts when integrating a library such as Bootstrap with existing or legacy code.

## Source excerpt

When creating a new CSS library or framework, developers typically take one of two approaches with component naming: the Bootstrap approach or the jQueryUI approach. Bootstrap tries to be as simple and basic as possible, calling a component exactly what it is. If something is a tooltip, why not use the class selector .tooltip to define how it looks? This approach keeps things simple, clean, and easy to remember, but it has one big disadvantage.