2017-07-31 26 views
0

私のウェブサイトでは、以下のブートストラップメニュー項目に従っています。私はメニューのアイコンをページの右隅に置く必要があります。コードを変更するにはどうすればよいですか?右側にブートストラップメニューアイコンを配置する必要があります

#menu { 
    position: relative; 
    color: #999; 
    width: 200px; 
    padding: 10px; 
    margin: auto; 
    font-family: "Segoe UI", Candara, "Bitstream Vera Sans", "DejaVu Sans", "Bitstream Vera Sans", "Trebuchet MS", Verdana, "Verdana Ref", sans-serif; 
    text-align: center; 
    border-radius: 4px; 
    background: white; 
    box-shadow: 0 1px 8px rgba(0,0,0,0.05); 
    /* just for this demo */ 
    opacity: 0; 
    visibility: hidden; 
    transition: opacity .4s; 
} 
#menu:after { 
    position: absolute; 
    top: -15px; 
    left: 95px; 
    content: ""; 
    display: block; 
    border-left: 15px solid transparent; 
    border-right: 15px solid transparent; 
    border-bottom: 20px solid white; 
} 

Codepen

答えて

1

変更#toggleこのようなCSS、

#toggle { 
    margin: 30px 10px 0px auto; // changed line 
} 

希望は私はあなたがウェブサイトの右上にあるハンバーガーのアイコンについて話していると仮定し、

+0

本当に私は新しいメニュー位置に応じてメニュー項目を右にプッシュする必要があります – Lion

+0

#menuブロックに同じマージン値を与えます。 @ライオン – Berkay

0

に役立ちます。これを達成するために、クラスにfloat:rightを追加することができます。

関連する問題