Как сделать 2 маленьких блока и 1 большой блок рядом? html

Вам должно подойти такое решение:

    <div style="height: 300px; display: flex;">
        <div style="flex: 4;">
            <div style="height: 50%; background-color: red;"></div>
            <div style="height: 50%; background-color: green;"></div>
        </div>
        <div style="flex: 8;">
            <div style="height: 100%; background-color: blue;"></div>
        </div>
    </div>