Javascript 语义下拉列表100%宽度（左=0px）？

在手机上，下拉菜单的宽度为屏幕宽度的100%，效果很好

<div id="heroes-dropdown" class="ui dropdown">
    <div class="text">Heroes</div>
    <i class="dropdown icon"></i>
    <div class="menu">
        <a class="item"><i class="edit icon"></i> Edit Profile</a>
        <a class="item"><i class="globe icon"></i> Choose Language</a>
        <a class="item"><i class="settings icon"></i> Account Settings</a>
    </div>
</div>

.menu 
{ 
    width:100vw;
    max-width:440px;
}

---

有人知道如何让菜单的宽度填充整个屏幕的任何下拉列表吗

您需要取消下拉列表div的相对位置，然后将所有下拉列表包装到另一个div中，并使其成为相对位置。绝对定位的项目将基于其到达的第一个定位祖先进行定位：

$（'.ui.dropdown'）.dropdown（）
菜单{
宽度：100vw；
最大宽度：440px；
}
.下拉式包装{
/*使包装器相对*/
位置：相对位置；
}
.dropdown wrapper.ui.dropdown{
/*如果这些div*/
位置：静态；
}

英雄
编辑配置文件
选择语言
帐户设置
英雄2
编辑配置文件
选择语言
帐户设置
英雄3
编辑配置文件
选择语言
帐户设置

<div id="heroes-dropdown2" class="ui dropdown">
    <div class="text">Heroes2</div>
    <i class="dropdown icon"></i>
    <div class="menu">
        <a class="item"><i class="edit icon"></i> Edit Profile</a>
        <a class="item"><i class="globe icon"></i> Choose Language</a>
        <a class="item"><i class="settings icon"></i> Account Settings</a>
    </div>
</div>

<div id="heroes-dropdown3" class="ui dropdown">
    <div class="text">Heroes3</div>
    <i class="dropdown icon"></i>
    <div class="menu">
        <a class="item"><i class="edit icon"></i> Edit Profile</a>
        <a class="item"><i class="globe icon"></i> Choose Language</a>
        <a class="item"><i class="settings icon"></i> Account Settings</a>
    </div>
</div>