角度材料如何垂直對齊MD按鈕

Question

我是新角材料。以下是我的簡單代碼。

<div layout="row" layout-margin> 
    <md-button ng-click='toggleSideNav()'><md-icon md-svg-icon='menu'></md-icon></md-button> 
    <div><div><img src='/Content/Images/logo.png' title='logo' alt='logo'></div></div> <!-- 138 * 66 image --> 
</div> 

任何人都可以幫助我如何在左側圖像中間垂直對齊菜單按鈕嗎？類似的菜單圖標的東西留下https://www.youtube.com/

感謝

Answer 1

這是很難從你的例子猜測要求，但解決方案之一可能是：

HTML：

<div layout="row" layout-align="start center" layout-margin> 
    <md-button class="md-raised" ng-click='toggleSideNav()'>Test</md-button> 
    <div > 
     <img src="/Content/Images/logo.png" title='logo' alt='logo'> 
    </div> <!-- 138 * 66 image --> 
</div> 

CSS ：

img { 
    margin-left: -112px 
} 

這是一個遊樂場：https://codepen.io/anon/pen/NjZEzb

Answer 2

實際上材料會爲您對齊。這個季節它沒有正確對齊是因爲你把圖像放在div中。

當您刪除雙div時，它完全對齊。如果由於某種原因，您需要保留這些div，請將它們設爲與您的圖片相同的高度。

我只是說這個：

div{ 
    box-shadow: 0 0 0 1px; 
} 

看問題。