如何通过flexbox左移图像，右移文本，我的代码不起作用

Question

我想将图像放在左侧，将文本放在右侧。 .main是容器，.picture是图像，.intro是txt。

<div class = "main">
    <div class="picture">
    <img src = "img/riesling.jpeg" />
    </div>

    <div class="intro">
    <h3>Intro</h3>
    <p>Always very high in acid, when made as a table wine Rieslings can be harmoniously sweet (sweet and sour) or dry (very acidic). The wine is polarizing because some people find dry styles too acidic and sweet styles too cloying, but sweetness is always a wine making decision and not inherent to the grape.
    </p>
    </div>


main {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap; 
}

.picture{
   width: 50%;
   align-items: flex-start;
}

.intro{
    width: 50%;
    align-items: flex-end;    
}

但是txt位于图片下方，而不是图片右侧，如何解决？