Hello, is it possible to add <small> tag to the list
It's more symantically correct than using a style or the font size https://www.w3schools.com/tags/tag_small.asp

I like to limit the use of font sizes generally or clients can go nuts with 'em ! 😉

Or maybe it might be best as a button, as it is an inline element?

Ah, fab that's great. It does stick it at the top instead of alphabeticising with those from the stylesheet. Is that changeable?

Also, it would be really handy if the styles dropdown could be grouped, as I find it gets really long.
I know there is a search and I try to prefix by something memorable for clients, but grouping would be easier for them.

Thanks very much
S :)

I have been thinking about this and I think I will move all of my "Format Elements" into the "Styles" dropdown. And because the Styles is created from <div>s & <span>s, I should be able to style this dropdown myself. Obv. this needs work, but I'm happy that it's feasible. Would it be possible to change the ids like this "mce_58" to use the title of the span? So for the following,

<div id="mce_58" class="mceMenuItem mceMenuItemEnabled mceEnabled mceSelected" role="option" aria-disabled="false" aria-pressed="false" aria-checked="true" tabindex="-1"><span class="mceText" title="bg-purple" aria-label="bg-purple" style="font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 13px; font-weight: 400; text-decoration: none solid rgb(36, 32, 32); text-transform: none; background-color: rgb(106, 95, 150); color: rgb(36, 32, 32);">bg-purple</span></div>

<div id="mce_58" ... would be <div id="mce_bg-purple" ... Thanks very much If anybody else is interested, this is the css I used in

/administrator/templates/isis/css/custom.css

to get the attached layout Your ids will change according to the styles you have in your dropdown. You could use a grid instead of flex to place each div exactly in its own position.

#jform_articletext_styleselect {
  min-width: 120px;
  max-width: 120px;
  overflow: hidden;
}
#menu_jform_articletext_jform_articletext_styleselect_menu {
  width: 80% !important;
}
#menu_jform_articletext_jform_articletext_styleselect_menu_items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column wrap;
          flex-flow: column wrap;
  overflow: scroll;
}
#menu_jform_articletext_jform_articletext_styleselect_menu_items > div {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50px;
          flex: 0 0 50px;
}
#mce_104 {
  display: none;
}
#mce_35::before,
#mce_41::before {
  color: white;
  background: grey;
  display: block;
  padding: 3px;
  border-right: 5px solid white;
}
#mce_35::before {
  content: "Block Elements";
}
#mce_41::before {
  content: "BG Colours";
}
#mce_41 ~ div span {
  font-size: 0 !important;
}
#mce_74 ~ div span {
  font-size: 13px !important;
}

Perfect! Brilliant, thanks very much.
Suburb support as always :)