JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <p>margin-top 10% / Elternelement: 310px x 150px</p>
</div>

<div>
    <p>margin-top 10% / Elternelement: 700px x 150px</p>
</div>

CSS

* {
    padding: 0;
    margin: 0;
}

div {
    border: 1px solid black;
    height: 150px;
}

p {
    margin-top: 10%;
}

div:nth-child(1) {
    width: 310px;
}

div:nth-child(2) {
    width: 700px;
}