柔性网格，水平与垂直堆叠？

Question

JSFiddle

我需要一个如下所示的弹性网格：

1|2
1|3

项目1是整个高度，项目2和3是高度的一半。如果不创建2个弹性网格，这可能吗？

ul {
    display: flex;
    flex-wrap: wrap;
    list-style-type: none;
    margin: 0;
}
li {
    flex-basis: 25%
}
li:first-child {
    flex-basis: 50%;
}

<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ul>