I am new to chrome web-extensions and I have written my first extension that injects a context menu in certain page contexts. This works fine and now I am looking at it from an aesthetics angle where I need some help.
One of my menu items has a long list of tiny selections. For example, "frequency" menu item leads to staccato-like slate of - 1min, 5min, 1d, 1w, ... There is another options that has exactly 2 choices - weekly, monthly. I have two questions.
(1) At present, I have a plain vanilla menu item for frequency which leads to a vertical list of 7 to 10 different next level menu items, arrayed on right and vertically. How can I have these appear horizontally, all in a single rectangular slice? For example, akin to
ul li.compacted {
display: inline;
border-right: solid thin red;
}
(2) For the second item with 2 sub-choices, I would like to try out embedding the two sub-choices within the same menu item "slice". E.g., vertically enlarge the menu item slice, and then place the two sub-choices horizontally undeeath the menu label. Using smaller font.
These are some alteatives I want to explore using AB tests, plus as part of my leaing. But I caot find any chrome docs that show how to control the menu items or its CSS. Finally I have put both questions in a single thread because I suspect the answers might be closely related.
Will appreciate your help.