значки выпадающего меню clr при добавлении каретки

Question

У меня есть HTML-код, и он выглядит следующим образом:

<div class="col-4 icnContainer">
     <clr-dropdown>
        <button clrDropdownTrigger aria-label="Dropdown demo button">
           <clr-icon shape="ellipsis-vertical"></clr-icon>
        </button>
        <clr-dropdown-menu clrPosition="top-left" *clrIfOpen>
           <div aria-label="Dropdown header Action 1" clrDropdownItem>Action 1</div>
           <div aria-label="Dropdown header Action 2"  clrDropdownItem>Action 2</div>
           <div clrDropdownItem>Link 1</div>
           <div clrDropdownItem>Link 2</div>
        </clr-dropdown-menu>
     </clr-dropdown>
 </div>

Мой вывод, полученный при такой настройке, показан на рисунке ниже: '

Как видно из круга, после многоточия добавлена ​​каретка.Мне не нужна каретка, я просто хочу многоточие, как показано ниже:

Может кто-нибудь сказать мне, как я могу этого достичь.Кроме того, раскрывающийся список открывается внутри содержащего элемента div, как показано ниже

Как я могу получить меню, открывающееся за пределами содержащего элемента Div.

Answer 1

Для позиционирования меню вы можете использовать одну из следующих позиций:

1. вверху справа
2. вверху слева
3. внизу справа
4. внизу слева
5. справа вверху
6. справа внизу
7. слева вверху
8. слева внизу

Вот демоверсия с позицией bottom-right: https://stackblitz.com/edit/so-58030404-dropdown-menu-positioning

Я не уверен, откуда берется значок карота. Можете ли вы раскошелиться и изменить стекаблик, чтобы создать репродукцию, на которую я могу смотреть?