Question

任何人都可以帮助解决这个CSS问题。当任何NavLevel2文本超过200px时，我需要NavDropDown更宽。列表项中不应有文本换行，NavLevel1应始终为200px宽。

<div id="Nav">
    <ul>
        <li class="NavLevel1" style="width: 200px; border: 1px solid Black;"><a><span>Level 1.1</span></a>
            <ul id="NavDropDown" style="border: 1px solid Black;">
                <li class="NavLevel2"><a><span>Level 2.1.1 test to see if this will push the width out a little</span></a></li>
                <li class="NavLevel2"><a><span>Level 2.1.2</span></a></li>
                <li class="NavLevel2"><a><span>Level 2.1.3</span></a></li>
            </ul>
        </li>
    </ul>
</div>

Answer 1

将width样式更改为min-width。

Answer 2

我急忙找到了，刚刚找到我的解决方案。

<div id="Nav">
    <ul>
        <li class="NavLevel1" style="width: 200px; border: 1px solid Black;"><a><span>Level 1.1</span></a>
            <ul id="NavDropDown" style="border: 1px solid Black; position:absolute;">
                <li class="NavLevel2" style="white-space: nowrap;"><a><span>Level 2.1.1 test to see if this will push the width out a little</span></a></li>
                <li class="NavLevel2"><a><span>Level 2.1.2</span></a></li>
                <li class="NavLevel2"><a><span>Level 2.1.3</span></a></li>
            </ul>
        </li>
    </ul>
</div>

CSS列表问题

2 个答案: