7 posts by 2 authors in: Forums > CMS Builder
Last Post: October 10, 2017   (RSS)

Hey Dave,

Try this CSS style sheet and see if it works out your issue.

<!doctype html>
<meta charset="UTF-8">

<style type="text/css">
    .breadcrumb {
        margin:0 auto;
    ul.breadcrumb, .breadcrumb li {
    .breadcrumb li {
    .breadcrumb li {
    .breadcrumb li a {
        padding:0.5em !important;
    .breadcrumb li a:hover {
    .breadcrumb li:after {
        content: " / ";



<ul class="breadcrumb">
    <li><a href="#">Menu 1</a></li>
    <li><a href="#">Menu 2</a></li>
    <li><a href="#">Menu 3</a></li>
    <li><a href="#">Menu 4</a></li>



Hi Zicky,

Your CSS does almost the same as mine except that it does not appear inline but as a list. After once I replace part of my original (below) to your CSS it makes it inline.

    .breadcrumb li ul {      display: inline;      margin: 0;      padding: 0;      float: left;    }

HOWEVER, the breadcrumb display generated by  CMSB still appears in reverse order. Clearly the solution has to be in the CSS which I cannot locate so I am wondering whether there is an equivalent to an orderBy where clause to make the breadcrumb appear in the correct sequence.



View the source code from your browser, copy and paste into the thread, and I'll take a look at what the final results of what's generated and used on the web page displayed. That's where I would start to rectify the issues with the CSS, because it may be that something on the php generating the list is introducing additional ul and li elements.

Okay, I found the problem style ... I removed the float:left and everything is back in the correct sequence.

Why that should affect the CMSB output I have no idea but it works.


Yea - I had a feeling float-left was the issue originally.

It really doesn't effect the actually CMSB output, but instead rearranges the outputted data in reverse because items where already displayed inline, and with float-left added it was reversing the display of data in the browser.

It behaves differently in this instance to previous ones I've designed. But ... I used it primarily to float div's not nested lists.

Thanks for your help Zicky.