I recently had problem with Enlighter plugin (for displaying code) being misaligned after upgrading my WordPress. The Enlighter text went outside the boxes in desktop browser mode and I contacted the author of the plugin for help in the forum, and learned it was actually Nested Order List (NOL) plugin that’s overriding the CSS rules that defines the margins.

Another user had similar problem NOL conflicting certain templates and the author of NOL suggested similar causes that the CSS style from the plugin messed with other styles:

.nested-list .entry-content ul,
.nested-list .hentry ul {
 margin:.8em 0 .8em 1.4em
}

The author suggested that the NOL plugin itself is not complicated to start with (it’s just adding a CSS), and the same functionality can achieved by adding this CSS to my WordPress theme template (pasting the following text under “Additional CSS”):

.entry-content ol,
.hentry ol {
 counter-reset:level1;
}
.entry-content ol ol,
.hentry ol ol {
 counter-reset:level2
}
.entry-content ol ol ol,
.hentry ol ol ol {
 counter-reset:level3
}
.entry-content ol>li,
.hentry ol>li {
 list-style-type:none;
 line-height:1.4;
 text-indent:-1.5em
}
.entry-content ol>li:before,
.hentry ol>li:before {
 content:counter(level1,decimal)'. ';
 counter-increment:level1;
 display:inline-block;
 text-align:right;
 text-transform:none;
 width:1em
}
.entry-content ol ol>li:before,
.hentry ol ol>li:before {
 content:counter(level2,lower-alpha)'. ';
 counter-increment:level2
}
.entry-content ol ol ol>li:before,
.hentry ol ol ol>li:before {
 content:counter(level3,lower-roman)'. ';
 counter-increment:level3
}

It worked like a charm!