css cheat sheet

1 keep text onn the same line

.class{

  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis 

 }

 2 boostrap toggle area item

a .jobfilter_h1:before {
    /* symbol for "opening" panels */
    font-family: FontAwesome;
    content: "\f067";
    float: right;
    clear:both;
    padding:0.4rem;
}

a.collapsed .jobfilter_h1:before {
    /* symbol for "collapsed" panels */
    content: "\f068";
    clear: both;
    padding: 0.4rem;
}




        <div class="jobfilter_h2item">
            <a data-toggle="collapse" href="#SecondaryFurtherEducation" role="button" aria-expanded="false" aria-controls="SecondaryFurtherEducation">
                <h5 class="jobfilter_h2"> Secondary & Further Education (346) </h5>
            </a>
            <div class="jobfilter_h3area  pt-1 pb-1 pl-3 collapse multi-collapse" id="SecondaryFurtherEducation">
                <div class="jobfilter_h3item">
                    <h6 class="jobfilter_h3"> Secondary Teaching (294)  </h6>
                </div>
                <div class="jobfilter_h3item">
                    <h6 class="jobfilter_h3"> Secondary Support Staff (30)   </h6>
                </div>
                <div class="jobfilter_h3item">
                    <h6 class="jobfilter_h3"> Secondary Senior Leadership Team (16)   </h6>
                </div>
                <div class="jobfilter_h3item">
                    <h6 class="jobfilter_h3"> Further Education (5) </h6>
                </div>
            </div>

        </div>
        <div class="clearfix"></div>