时间戳

首页 > 解决方案 > 防止块元素的高度在没有绝对定位的情况下推动其他块元素？

css - 防止块元素的高度在没有绝对定位的情况下推动其他块元素？

问题描述

https://codepen.io/arandomcodepenuser/pen/NWjYGwo

好的，所以我有这个顶部导航栏，问题是我不能只更改 html 的样式，因为我使用的是 Wordpress 插件，而且这个导航栏在导航栏上有块元素，其中一个有元素内而不是下面的下拉菜单，我不能使用javascript来更改它，我想知道嵌入在 li 元素中的下拉菜单是否有可能在悬停时下推导航栏上的其他元素。

这是html：

<div>
   <ul class="top-bar__menu">
      <li id="menu-item-265276" class=""><a href=""><span>Find Us</span></a></li>
      <li id="menu-item-280208" class="">
         <a href="#"><span>About</span></a>
         <ul class="sub-menu">
            <li id="menu-item-268209" class=""><a href=""><span>About Us</span></a></li>
            <li id="menu-item-265276" class=""><a href=""><span>Find Us</span></a></li>
            <li id="menu-item-280209" class=""><a href="" aria-current="page"><span>Our Team</span></a></li>
         </ul>
      </li>
   </ul>
</div>

这是下拉菜单的css样式：

.sub-menu {
  display: block;
}

.sub-menu li {
  clear:both;
  width: 100%;
}

ul.sub-menu {
  display: inline;
  background-color: #fff;
  max-width: 100px;
}

标签： css

解决方案

推荐阅读