Because of Specificy Wars
I am using Semantic UI and as you can imagine from this example
<div class='ui vertical borderless menu component-menu'></div>
..the '.ui.vertical.borderless' multiple classes will overwrite my .component-menu class.
<div id='component-menu' class='ui vertical borderless menu'></div>
..will make sure that whatever classes combination there are, I always can easily style with CSS or any preprocessor each component/template independently.