Semantic-UI中的子菜單中的項目在移動視圖中消失

Question

請看https://jsfiddle.net/797311vt/。

以下菜單在較寬視圖中看起來很好，但最後一項（第四個）在移動視圖中消失。它也消失與<div class="right stackable menu">。

<div class="ui stackable menu"> 
    <a href="#" class="item">Home</a> 
    <a href="#" class="item">Second</a> 
    <div class="right menu"> 
    <a href="#" class="item">Third</a> 
    <a href="#" class="item">Fourth</a> 
    </div> 
</div> 

如何在移動視圖中顯示所有四項顯示的可堆疊菜單？

Answer 1

這是一個開放的錯誤爲22月2016（鏈接：https://github.com/Semantic-Org/Semantic-UI/issues/3604）的

要走動的bug，你可以做到以下幾點：https://jsfiddle.net/batrasoe/udpzkj7p/

<div class="ui stackable menu"> 
    <a href="#" class="item">Home</a> 
    <a href="#" class="item">Second</a> 
    <a href="#" class="right item">Third</a> 
    <a href="#" class="item" id="last-item">Fourth</a> 

    </div> 

它不使用右菜單，但將正確的類分配給菜單中倒數第二個元素，這會將元素的右側推向右側。

您還必須在最後一個元素上添加一個border-left屬性。詳情請看小提琴。