Menu
To specify multiple classes, separate the class names with a space, e.g. <span class="left important">. This allows you to combine several CSS classes for one HTML element.
An element is usually only assigned one class. The corresponding CSS for that particular class defines the appearance properties for that class. However, we can also assign multiple classes to the same element in CSS. In some cases, assigning multiple classes makes page styling easier and much more flexible.
CSS grouping can be used to condense code that has multiple selectors with the same declarations. This makes code easy to read and maintain. Also development time is significantly reduced as there is less code to write. Page load times are reduced as well when using grouping.
I'm trying to do some buckets here and generally I would do 1 class element at a time. That seems silly since classes can share attributes.
HTML
<div id = "outerBuckets">
<div class = "bucket1">
<div class ="bucketIcon">
<p></p>
</div>
</div>
<div class = "bucket2">
<div class ="bucketIcon">
<p></p>
</div>
</div>
<div class = "bucket3">
<div class ="bucketIcon">
<p></p>
</div>
</div>
<div class = "bucket4">
<div class ="bucketIcon">
<p></p>
</div>
</div>
<div class = "bucket5">
<div class ="bucketIcon">
<p></p>
</div>
</div>
<div class = "bucket6">
<div class ="bucketIcon">
<p></p>
</div>
</div>
</div>
So I wanted to do my css rules like this:
.bucket 1 .bucket 2 . bucket 3 {
}
.bucket 4 .bucket 5 .bucket 6 {
}
Basically I wanted 123 to be formatted the same way...and 456 to be formatted another way. But when I went to do some checking in firebug. It wasn't working. So I guess this isn't correct way to express this. I'm trying to clean up my css a little and combined down some of these things so they are cleaner.
Any suggestions?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With