Want to alter the look of the ckeditor dropdown menu "Styles"

Question

Using ckeditor in Drupal 8. The dropdown menu itself is too small and short and the type inside is too large. How can I actually change the formatting of the Styles dropdown menu itself?

Answer 1

Drupal 8 / 9: You can define a stylesheet for CKEditor in your (Admin-)Theme to override the appearance of the editor. First add a new CSS-file (e.g. css/ckeditor-override.css) to your admin-theme. Add the following line to your admin-(sub)theme's info-file (e.g. myadmintheme.info.yml):

ckeditor_stylesheets:
  - css/ckeditor-override.css

Then you can change the appearance of the editors – see hints of j.swiderski answer – for example:

.cke_combopanel {
width:200px !important;
}
.cke_panel_list .mystyle {
font-size: 1em !important;
}

If your stylings do not work, have a look into your theme: Maybe it styles the editor, too, and overrides your stylings? Some themes – like "Gin" – make it easy and provide a css-file for custom overrides. Then simply put your style-overrides for the editor there.

If you don't want to create a subtheme you can try Asset Injector-Module.