Make div fixed height by percent
<p>I'm creating a div with 100% width of parent and now i want it to be 10% height of parent (no mater how long the content is). </p>

<p>I set <code>height: 10%</code> but it still didn't solve my problem.</p>

<p>Here is my css:</p>

<pre><code>body {
    margin: 0px;
    padding: 0px;
    height: 100%;
}

.header {
    display: inline-block;
    background-color: #008CDA;
    width: 100%;
    height: 10%;
    margin: 0px auto;
    padding: 0px;
}
</code></pre>