CSS file class format confusion

I spent the whole of yesterday trying to work out why bootstrap styles were not being applied in my pages and finally notices that the styles weren’t even being applied. This seems to be because the styles in my css file where in the format:

.cms-bootstrap .col-lg-2{
...
}

and I was trying to apply them like this

<div class="col-lg-2">hello</div>

the site I’m working on is quite large and we have a third party company supplying the main styles, there are several other 75k style files so it took a bit of investigation to find what seems to be the cause. I need to apply the grid styles so I can position some elements correctly on the page.

if I apply the styles like this:

<div class="cms-bootstrap>
<div class="col-lg-2">hello</div>
</div>

then all is well and the styles are applied correctly.

Can someone please explain the significance of the outer div needed ? I can see the connection between the 2 classes defined in the CSS file I just don’t know what they are and can’t find an explanation anywhere.

Thanks

Steve


Source: css

Leave a Reply