Hi I stumbled upon an issue with CSS classes, I can reproduce it but am not sure if it’s me using CSS with MODx in a wrong way as I am quite new to MODx.
I put my CSS in a document in the MODx resources and have the document content type set to CSS. I link to this CSS document in my template and the styles are processed properly for tags and id’s. Now my issue:
if the first statement in the CSS document is a class fx:
.myClass{
CSSproperty: CSSvalue;
}
then the class is not processed, which means the styles defined in the class are not applied, all other following CSS is though. If I put some non-class CSS statements before the class statement, the class is processed properly, fx:
div {
}
.myClass{
CSSproperty: CSSvalue;
}
I tested this with following CSS:
div {
border: 0px;
margin: 0px;
padding: 0px;
outline: 0px;
}
.centered {
margin-left: auto;
margin-right: auto;
}
#logoContainer {
width: 128px;
}
#logo {
width: 128px;
height: 200px;
}
and following HTML in the Home document of MODx:
<div id="logoContainer" class="centered">
<img id="logo" src="[[~3]]" />
</div>
If I remove the first div statement in the css the .centered class is not processed. And empty div statement in the CSS is enough to get the class processed.
Anyone else experience this?
Server info: MODx Revolution 2.0.8-pl (traditional), Apache 2.2.17, PHP 5.2.17, MySQL 5.1.47-community-log, pdo_mysql 5.1.47
Client info: Safari 5.0.4