Navbar bug on bootstrap

Question

私はnavbarを作ったので、javascriptの機能を有効にした後、いくつかの後に表示したいと思っています。

HTMLコード：

<ul id="HelloDiv" class="nav navbar-nav"> 
<li id="UserHello" style="visibility: hidden"><a href="#">Hello</a></li></ul> 

javascriptのコード：

function IsLogedIn(TextBoxID) 
    { 

     if(TextBoxID.value != 'nothing') 
     { 
     document.getElementById('LogInBTN').style.visibility = 'hidden'; 
     document.getElementById('UserHello').style.visibility = 'visible'; 
     // document.getElementById('HelloDiv').className = 'nav navbar-nav'; 
     // document.getElementById('UserHello').className = 'nav navbar-nav'; 
     document.getElementById('UserHello').innerHTML = 'hello ' + TextBoxID.value; 

     } 
} 

This is how it supposed to look like

This is how it really look like

ヘルプ？

Answer 1

あなたは私はあなたの質問のお手伝いをする方法を知っているが、主な理由は、コードと付属のリンクからnavbar-text

<ul id="HelloDiv" class="nav navbar-nav"> 
    <li id="UserHello" class="navbar-text" style="visibility: hidden"><a href="#">Hello</a></li> 
</ul> 

Answer 2

にUserHello要素のクラスを設定する必要があります。あなたがこの性質の将来の問題のためにあなたの質問を言い直すことができれば、それは認められるでしょう。ありがとう。

解決策は余白を追加することです。これは、テキストを下に移動し、その上を横切る要素を停止させることです。

希望します。