我的圖標不浮右

IMAGE:icon not floating to right and its meant to be perfect circle but its cut 我的圖標不浮右

我想要的圖標推到標題的右邊但都沒有任何avail.This是HTML：

<body class="mdl-demo mdl-color--grey-100 mdl-color-text--grey-700 mdl-base"> 
    <div class="mdl-layout mdl-js-layout mdl-layout--fixed-header"> 
     <header class="mdl-layout__header mdl-layout__header--scroll mdl-color--primary"> 
     <div class="mdl-layout--fixed-header mdl-layout__header-row"> 
     </div> 
     <div class="mdl-layout--fixed-header mdl-layout--fixed-header mdl-layout__header-row"> 
      <h2>example.com</h2><button class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon" style='float:right' id="account"> 
       <i class="material-icons md-36 orange600">account_circle</i></button> 
     </div> 
     <div class="mdl-layout--fixed-header mdl-layout__header-row"> 
     </div> 
     <div class="mdl-layout__header-row portfolio-navigation-row"> 
      <nav class="mdl-navigation mdl-typography--body-1-force-preferred-font"> 
     {% block header %} 

      {% endblock %}   
      </nav> 

      </div> 

     </header>

用CSS一直：

.mdl-demo .mdl-layout__header-row { 
    padding-left:10px; 
    height:30px; 
} 
.material-icons.md-36 { 
    font-size: 36px; 
    float:right; 
} 
.material-icons.orange600 { color: #ff4081; 
    float:right; 
}

來源

2016-08-05 A.Lang

請將代碼添加到小提琴中... – Nehemiah

它看起來還好這裏：https://jsfiddle.net/L22ba1vs/

你所提供的代碼是INCO方式完整的，我添加了關閉div和關閉身體標籤，顯然是失蹤。

<body class="mdl-demo mdl-color--grey-100 mdl-color-text--grey-700 mdl-base"> 
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header"> 
    <header class="mdl-layout__header mdl-layout__header--scroll mdl-color--primary"> 
    <div class="mdl-layout--fixed-header mdl-layout__header-row"> 
    </div> 
    <div class="mdl-layout--fixed-header mdl-layout--fixed-header mdl-layout__header-row"> 
     <h2>example.com</h2><button class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon" style='float:right' id="account"> 
      <i class="material-icons md-36 orange600">account_circle</i></button> 
    </div> 
    <div class="mdl-layout--fixed-header mdl-layout__header-row"> 
    </div> 
    <div class="mdl-layout__header-row portfolio-navigation-row"> 
     <nav class="mdl-navigation mdl-typography--body-1-force-preferred-font"> 
    {% block header %} 

     {% endblock %}   
     </nav> 

     </div> 

    </header> 
    </div> 
    </body>

來源

2016-08-05 09:50:05 JBartus

我的圖標不浮右

回答

相關問題