html - HTML/CSS: div 内のコンテンツの整列

Question

たとえば、下の画像のように</div>、属性を使用して要素を整列させるにはどうすればよいですか。align

• e1 :align="top"
• e2 :align="right"
• e3 :align="bottom"
• e4 :align="left"

編集：この場合、私が伝えたいことは明確ではありません。これは宿題でも何でもなく、自分で HTML / CSS を学びたかっただけです。属性のみを使用してこれを達成できるかどうかを尋ねていました。align

私が作っているもののこのコードスニペットが、私が本当に達成したいことを理解するのに役立つことを願っています:

<div id="container">

    <div id="nav-vbar">
    <button class="btnV" align="top"></button>
    <button class="btnV" align="bottom"></button>
    </div>

    <div id="navigation">
    </div>

    <div id="nav-hbar">
    <button class="btnH" align="left"></button>
    <button class="btnH" align="right"></button>
    </div>

    <div id="preview">
    </div>

</div>

私が取り組もうとしている結果(grayed divs are in focus)