JSFiddle - React, Tailwind, and code Playground

HTML

<div id="asides">
    <aside>
        <h1>חדשות ומבצעים</h1>
    </aside>
    <aside>
        <h1>קבל הצעת מחיר</h1>
    </aside>
</div>

<div id="sections">
    <section>
        <h1>בר התקנות תקשורת</h1>
        <p>בר התקנות תקשורת נוסדה בשנת 1998, החברה עוסקת במגוון רחב של נושאי תקשורת כגון: מרכזיות טלפונים, רשתות מחשבים, סיבים אופטיים, מצלמות אבטחה ומחשבי הקלטה.</p>
    </section>
    <section>
        <h1>בין לקוחותינו:</h1>
    </section>
</div>

CSS

div {
    height: 400px;
}

#asides {
    float: left;
    width: 40%;
}

#sections {
    float: right;
    width: 60%;
}

div h1 {
    font-size: 100%;
    font-weight: bold;
}

aside, section {
    background-color: #DFEFF0;
    margin: 1em;
}

aside {
    height: 50%;
}

section {
    height: 60%;
}

section + section {
    height: 40%;
}