無法對齊在HTML文件中的兩個元素

Question

我有兩個按鈕，我想對準在同一直線上，並且由於某些原因，第二個是下面的第一個...

我想將它們分組在一個div將有所幫助。

這是我目前使用的html，我嘗試將<md-switch>與<button>組合起來可能有些困難。

<div> 
    <button md-button (click)="publish()" class="md-primary">Update</button> 
    <md-switch [(checked)]="data.cb1">Sho: {{ data.cb1 }}</md-switch> 
</div> 

如果我給它添加一個樣式屬性，只有按鈕會作出反應，所以很顯然，md-switch正在發生什麼。

Answer 1

<md-switch>是一個directive並沒有按鈕。所以HTML會被角度替換/解析（我認爲）輸出塊級元素。
解決方案將使用display: inline-block;或float: left;。
display: inline-block;更容易，但會爲您的元素添加1px的邊距。 對於漂浮物，<button>也必須是display: block;。