Remove ExtJs7.x MenuItem empty icon space

Menu items with no icon still have the space allocated on the left of the button. If you wish to remove that space so the menu item text has no left padding, it can be done as follows.

In Application.scss add CSS class hide-menu-icon :

Configure the menu item with:

There are 3 menu items in the example:

  • one has cls config
  • one has extra iconCls config
  • one has no cls config

Refresh your app, the result should be:

  • menu item with cls config will display no left margin or icon space regardless of the iconCls config.
  • menu item with none cls config will display  icon space.

END!

Leave a Reply