我有一个弹性盒子，其中包含两个项目，以适合在一个有限的空间一行。如何使右侧的项目覆盖其他项目？

<style>
    .flex-container {
        display: flex;
        position: relative;
    }
    .item {
        width: 100px;
        height: 100px;
        margin: 10px;
        background-color: #ccc;
    }
    .item-right {
        z-index: 999;
        background-color: #f00;
    }
</style>

<div class="flex-container">
    <div class="item">项目1</div>
    <div class="item">项目2</div>
    <div class="item item-right">项目3（右侧项目）</div>
</div>