有没有办法将 child div 的 width 设置为浏览器的 100%，而不是 的 100% >父div?
Position: fixed 是我找到的唯一方法，但这是导航的一部分，因此无法使用。它基本上是一个 dropdown 菜单，sub-nav 需要覆盖浏览器宽度的 100%。
最好只使用 css。我正在处理一个 DNN nav，我无法修改脚本本身。
该脚本在 jQuery 中，所以如果有办法在文档中修改它，我也许可以这样做。
这是菜单结构
<div id="dnnStandardMenu">
<ul class="dnnNav">
<li data-page-id="676387" class="root mi mi0 sel first" style="width: 126px;"><a href="/Default.aspx?tabid=676387" target="" class="txt">Home</a></li>
<li data-page-id="914191" class="root mi mi0" style="width: 144px;"><a href="/Default.aspx?tabid=914191" target="" class="txt">Culture</a></li>
<li data-page-id="914192" class="root mi mi0" style="width: 145px;"><a href="/Default.aspx?tabid=914192" target="" class="txt">Contact</a></li>
<li data-page-id="914193" class="root mi mi0" style="width: 132px;"><a href="/Default.aspx?tabid=914193" target="" class="txt">Coach</a></li>
<li data-page-id="914194" class="root mi mi0 haschild" style="width: 138px;"><a href="/Default.aspx?tabid=914194" target="" class="txt">REFEREE</a><ul class="m m0">
<li class="col"><ul class="col1"><li data-page-id="914196" class="mi mi1 first"><a href="/Default.aspx?tabid=914196" target="" class="txt"><span class="icn no-icn"></span>Online Training</a></li><li data-page-id="914198" class="mi mi1 last"><a href="/Default.aspx?tabid=914198" target="" class="txt"><span class="icn no-icn"></span>Referee Supplies</a></li></ul></li><li class="col"><ul class="col2"><li data-page-id="914197" class="mi mi1"><a href="/Default.aspx?tabid=914197" target="" class="txt"><span class="icn no-icn"></span>SAY vs. USSF Rule Differences</a></li></ul></li><li class="col"><ul class="col3"><li data-page-id="914199" class="mi mi1"><a href="/Default.aspx?tabid=914199" target="" class="txt"><span class="icn no-icn"></span>Qualifications</a></li></ul></li></ul>
</li>
<li data-page-id="914205" class="root mi mi0" style="width: 138px;"><a href="/Default.aspx?tabid=914205" target="" class="txt">sadmin</a></li>
<li data-page-id="7" class="root mi mi0 haschild last" style="width: 123px;"><span class="txt">Host</span><ul class="m m0" style="visibility: visible; left: -55px; width: 752px; right: auto; display: none;">
<li class="col" style="height: 260px;"><ul class="col1"><li data-page-id="187309" class="mi mi1 first"><a href="/Default.aspx?tabid=187309&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Health Monitor</a></li><li data-page-id="252866" class="mi mi1"><a href="/Default.aspx?tabid=252866&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Host Alerts</a></li><li data-page-id="116842" class="mi mi1"><a href="/Default.aspx?tabid=116842&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Payment Sync</a></li><li data-page-id="85608" class="mi mi1"><a href="/Default.aspx?tabid=85608&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Report Wizard 2.0</a></li><li data-page-id="19" class="mi mi1"><a href="/Default.aspx?tabid=19&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>File Manager</a></li><li data-page-id="83444" class="mi mi1"><a href="/Default.aspx?tabid=83444&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Lists</a></li><li data-page-id="112125" class="mi mi1"><a href="/Default.aspx?tabid=112125&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Extensions</a></li><li data-page-id="545857" class="mi mi1 last"><a href="/Default.aspx?tabid=545857&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>HTML Editor Manager</a></li></ul></li><li class="col" style="height: 260px;"><ul class="col2"><li data-page-id="16" class="mi mi1"><a href="/Default.aspx?tabid=16&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Host Settings</a></li><li data-page-id="181364" class="mi mi1"><a href="/Default.aspx?tabid=181364&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Bulk Email</a></li><li data-page-id="92782" class="mi mi1"><a href="/Default.aspx?tabid=92782&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Daily Payment Summary</a></li><li data-page-id="129517" class="mi mi1"><span class="txt"><span class="icn no-icn"></span>Store</span><ul class="m m1">
<li data-page-id="129518" class="mi mi2 first"><a href="/Default.aspx?tabid=129518&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Royalty Invoices</a></li>
<li data-page-id="129519" class="mi mi2"><a href="/Default.aspx?tabid=129519&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Royalty Report - Current Period</a></li>
<li data-page-id="149762" class="mi mi2"><a href="/Default.aspx?tabid=149762&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Product Sales Report</a></li>
<li data-page-id="152479" class="mi mi2"><a href="/Default.aspx?tabid=152479&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Product Sales Origin Report</a></li>
<li data-page-id="157549" class="mi mi2"><a href="/Default.aspx?tabid=157549&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Portal Products</a></li>
<li data-page-id="157550" class="mi mi2 last"><a href="/Default.aspx?tabid=157550&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Product Attribute Editor</a></li>
</ul>
</li><li data-page-id="21" class="mi mi1"><a href="/Default.aspx?tabid=21&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>SQL</a></li><li data-page-id="83445" class="mi mi1"><a href="/Default.aspx?tabid=83445&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Superuser Accounts</a></li><li data-page-id="113401" class="mi mi1"><a href="/Default.aspx?tabid=113401&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Skins</a></li></ul></li><li class="col last" style="height: 260px;"><ul class="col3"><li data-page-id="308159" class="mi mi1"><a href="/Default.aspx?tabid=308159&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Order Summary</a></li><li data-page-id="17" class="mi mi1"><a href="/Default.aspx?tabid=17&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Site Management</a></li><li data-page-id="93184" class="mi mi1"><a href="/Default.aspx?tabid=93184&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Invoice Summary</a></li><li data-page-id="157553" class="mi mi1"><a href="/Default.aspx?tabid=157553&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>AT</a><ul class="m m1">
<li data-page-id="157557" class="mi mi2 first"><a href="/Default.aspx?tabid=157557&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Template Manager</a></li>
<li data-page-id="157558" class="mi mi2 last"><a href="/Default.aspx?tabid=157558&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Email Template Manager</a></li>
</ul>
</li><li data-page-id="3810" class="mi mi1"><a href="/Default.aspx?tabid=3810&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Schedule</a></li><li data-page-id="112124" class="mi mi1"><a href="/Default.aspx?tabid=112124&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Dashboard</a></li><li data-page-id="545856" class="mi mi1"><a href="/Default.aspx?tabid=545856&portalid=9048" target="" class="txt"><span class="icn no-icn"></span>Configuration Manager</a></li></ul></li></ul>
</li>
</ul>
</div>最佳答案
是的。只需设置 width: 100vw，其中 vw 是视口(viewport)宽度的 1/100。如果它被覆盖，只需在它旁边使用 !important。
关于jquery - 有没有办法将子 div 的宽度设置为浏览器的 100%？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39979898/