CSS：下拉菜单中的相对位置会影响父级

Question

我有一个包含li孩子的ul父母。两者都需要被定位为亲戚。

问题是ul子项的宽度会更改li父项的宽度。

这是我的代码：

HTML

<li class="nav open">
<ul class="dropdown-menu " role="menu">
    <li id="t-smwbrowselink"><a href="/mediawiki/index.php/Special:Browse/Main_Page" rel="smw-browse" tabindex="-1">Browse properties</a></li>
    ....
</ul>

CSS

li.nav.open {
    position: relative;
    overflow: auto;
    display:  inline-block;
}

ul.dropdown-menu {
    position: relative;
}

我添加了结果的图像。 Image。如果父亲ul处于相对位置，我怎样才能让父母if (person != null && person.getId() == null) { // Do something, for example create person on the db } 独立于孩子？

Answer 1

我假设您正在使用BootStrap？如您所知，子菜单/下拉列表ul开箱即用position: absolute。

您可以向问题max-width添加li - 这是一个小提琴：https://jsfiddle.net/xu7u8prn/

li.dropdown.open {
  position: relative;
  max-width: 100px;
}
ul.dropdown-menu {
  position: relative;
}

请注意我已经为我的例子提供了BootStrap默认导航代码。

您需要进行一项实验，了解您的情况究竟有什么作用......