How do I wrap text around in an image in css grid?

1

I’m working with css grid and I have an image that I want to wrap text below when there is enough space. How do I do this? Code and pictures below: (The picture is taken of the “content” and “sidebar”) Thank you.

11 PM
11 PM1269×538 214 KB

//Overall wrapper//
.wrapper{
    display:grid;
    grid-template-areas:
        "logo"
        "social"
        "banner"
        "content"
        "sidebar"
        "footer"
}

//Grid Layout
@media only screen and (min-width:600px){
    .wrapper{
        grid-template-columns:200px auto 350px;
        grid-template-areas:
            "logo logo social"
            "banner banner banner"
            "content content sidebar"
            "footer footer footer"
    }