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

У меня есть свой 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.


vmware-clarity
person Tatenda    schedule 20.09.2019    source источник

Ответы (1)


arrow_upward
1
arrow_downward

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

  1. в правом верхнем углу
  2. верхний левый
  3. Нижний правый
  4. Нижний левый
  5. справа вверху
  6. справа-снизу
  7. слева вверху
  8. слева-снизу

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

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

person hippeelee    schedule 20.09.2019
comment
Хорошо, позволь мне это сделать. Проблема не в позиционировании как таковом. Дело в том, что когда меню открывается, оно открывается внутри содержащего его div. Как вы можете видеть на картинке, он открывается в верхнем правом углу, но находится внутри div, содержащего раскрывающийся список, а не снаружи, где я могу получить к нему доступ. - person Tatenda; 20.09.2019