Почему ширина: 100% не применяется к элементу локального хостинга?

Question

В этом пользовательском элементе width: 90% не будет применяться при использовании в :host, но width: 90% будет применяться, если я применю его к section, Почему это? не portfolio-display элемент теневой дом, в котором width: 90% следует применять как элемент хостинга вместо section?

<dom-module id="portfolio-display">
  <style>
    :host {
      height: 60%;
      transition: box-shadow 0.2s ease-out;
     }

     section {
       width: 90%;
       background-color: #5a7785;
     }


    .big {
      height: 100px;
      width: 100px;
    } 
  </style>

  <template>
    <section>
      <div onclick="page('/portfolio')"
        class="vertical layout">
        <div>

Answer 1

Я думаю, что вы пропали без вести display: block; на ваше :host,

section работает, потому что большинство браузеров отображают section элементы с

section { 
    display: block;
}

Посмотрите этот поршень для примера.