ブートストラップを使用した水平ドロップダウンメニューの整列

Question

私は水平に整列し、整列に関するいくつかの問題を抱えているドロップダウンメニューを取得しようとしています。ここで

は私のバイオリン

https://jsfiddle.net/jqf66dbp/

であるあなたは、各メニュー項目、ドロップダウンボックスを通してクリックしたとき、私は基本的には基本的には、ドロップダウン

.dropdown-menu { 
    padding: 15px; 
    min-width: 500px; 
    } 

    .navbar-right .dropdown-menu { 
    right: inherit; 
    } 

のCSSに以下の変更を追加しました右側に移動します。最初のメニュー項目と同じ位置に固定されるようにする方法はありますか？

私が解決しようとしている2番目の問題は、ドロップダウン内の項目です。私のバイブルの例では、残りのアイテムよりも長いアイテムを作成しました。 "Update Collaborate"このアイテムは、他のアイテムをすべてシフトし、アライメントを崩してしまうことに気づくでしょう。どのようにすべてのアイテムをよりうまく整列させ、「更新コラボレーション」を1行で行うことができますか？

ありがとうございました！

Answer 1

あなたの最初の問題の修正されたフィドルです。私はそれを100％にした下のCSSクラスのドロップボックスのサイズを調整することができます。 https://jsfiddle.net/jqf66dbp/3/

.dropdown-menu { 
    padding: 15px; 
    /* min-width: 500px; */ 
    width: 100%; 
    position: fixed; 
    top: 48px; 
    z-index: 1000; 
    text-align: left; 
    padding: 15px; 
    margin: 0 auto; 
    left:0px; 
} 

あなたは第二の問題についての詳細を与えてもらえ - ：？フィドル更新

私は上記のCSSの変更後に問題がないので、