Span DIV网页的100％宽度

我在我的网页上有一个'Services'链接，点击时显示一个子菜单。我想跨越这个子菜单100％宽度的页面。Span DIV网页的100％宽度

这是可能的&我该如何更改我的代码以允许这个？

我使用的引导。

这里是我的HTML：

<ul class="nav navbar-nav navbar-left "> 
       <li class="dropdown"> 
        <a href="#" class="dropdown-toggle" data-toggle="dropdown"> Services </a> 

        <ul class="dropdown-menu"> 
       <li><div class="yamm-content"> <ul class="nav navbar-nav navbar-left"> <li><a href="#">Bla</a></li> <li><a href="#">Bla</a></li> <li><a href="#">Bla</a></li> <li><a href="#">Bla</a></li> </ul></div> 
      </li> 
</ul> 

    </li> 

</ul>

非常感谢

来源

2014-11-08 michaelmcgurk

您必须给下拉菜单及其所有父母提供100％的宽度。但服务链接也将全面配合。

.navbar-nav 
{ 
    width: 100%; 
} 

.dropdown{ 
width: 100% 
} 

.dropdown-menu{ 
width: 100% 
}

我更新了小提琴http://jsfiddle.net/19y4qnkx/4/

编辑：刚才看到，这是打破在小屏幕上的风格。这里是一个更新的小提琴与媒体查询http://jsfiddle.net/19y4qnkx/6/

来源

2014-11-08 14:58:51

是否有可能'服务'将保持其现有宽度？ – michaelmcgurk 2014-11-08 15:04:06

是的，如果你给链接一个“display：inline-block”。 http://jsfiddle.net/19y4qnkx/10/ – 2014-11-08 15:27:56

也许你可以在你的CSS使用VW单位为贵 “的.dropdown菜单” 是这样的：

.dropdown-menu{ 
    min-width: 100vw; 
}

我让你在这里检查兼容性http://caniuse.com/#feat=viewport-units。

来源

2014-11-08 14:52:46 JordanWD

我不知道我得到它的权利，甚至接近它，因为它是非常棘手的改变正在应用的Bootstrap CSS样式。但是，我改变了DIV：<div class="yamm-content">使用CSS类'test'以及在以下fasthion：<div class="yamm-content test">

下面是CSS类测试：

.test { 
    width: 100%; 
    background-color: yellow; 
}

Fiddle

现在，当你展开下拉菜单子菜单的背景以黄色显示。服务菜单文字周围有红色边框，所以仍然可以进行微调。好吧，就像它说的那样，改变Bootstrap CSS样式之后是非常棘手的。我不知道这是否可以通过自己的Bootstrap customization来解决。

来源

2014-11-08 15:22:23 jyrkim

Span DIV网页的100％宽度

回答

相关问题