無法獲取css以應用於Angular Component

Question

我已經堅持了一段時間。

我創建了一個名為app-place-icon-avatar的Angular組件。

我希望app-place-icon-avatar可以是55px的高度，也可以是div的高度的100％。

我嘗試了很多東西。

請參閱屏幕截圖，了解我所引用的內容。

當我檢查它時，html元素顯示17px高，但55px的css似乎正確應用。

我已經嘗試應用:: host / deep /，:: host，將樣式直接應用於父組件的html中的place-icon-avatar。

我檢查時似乎正在應用css。 它說右邊的高度為100％，但無論我做什么，實際的app-place-icon-avatar都是17px。

我是棱角分明的新手，如果我遺漏了一些基本的東西，我很抱歉，但我已經搜索了一段時間，找不到任何有用的東西。

我想讓這個組件達到一定高度的原因是它更容易居中。 由於app-place-icon-avatar中的圖像是55px，但app-place-icon-avatar本身只有17px高，因此很難將其垂直居中。 我想盡量簡單。

:host /deep/ {
  height: 50px;
}

我期待app-place-icon-avatar的高度為55px或100％。 無論我嘗試什么，它都是17px。

Answer 1

Jojofoulk給了我答案，就是將displaymode改為flex或block。 這解決了這個問題。