Css 保持子宽度动态，同时不调整父宽度的大小

“我的菜单”的子元素在调整父元素的大小和按下页面上的其他项目时出现问题。现在，“服务”下项目的下拉列表显示了我们希望它们如何显示，但它们会调整父项的大小并向下推下方的div。我尝试了绝对定位家长，而使孩子的位置相对没有成功

（在主菜单中滚动“服务”：

以下是我正在使用的菜单项的自定义CSS：

uk-dropdown.uk-dropdown-navbar.uk-dropdown-width-1 {
    position: relative !important;
}
.uk-parent.uk-nav-header {
    display: inline;
}
.uk-navbar {
    max-height: 46px;
}
.uk-nav-header {
    float: left !important;
}

---

提前感谢您的洞察力

这将帮助您解决问题

将位置：绝对指定给子对象，并将其父位置：相对

代码如下：

.uk-navbar-nav > li {
position: relative;
float: left;
}

.uk-dropdown.uk-dropdown-navbar.uk-dropdown-width-1 {
position: absolute;
}

---

虽然这确实解决了子菜单移动其他元素的问题，但现在子菜单的宽度并没有像我所希望的那样根据其内容进行扩展。关于如何在不改变父宽度的情况下保持该宽度，有什么想法吗？添加这个css.uk-dropdown.uk-dropdown-navbar.uk-dropdown-width-1{位置：绝对；宽度：597px；}谢谢Manik！它看起来更像我想要的样子。你知道有没有办法让下拉宽度变为597px？宽度应以标题为基础，因此正如您在“服务”中看到的，每个标题应以新列开头，但某些菜单只有一列。我正试图使其他子菜单（滚动“事件”和“查找”）的宽度达到所需的宽度。