html - CSS: Wrap Text From Multiple Rows Around Floating Element

Question

I am trying to have a page of aligned labels and descriptions where there is a single image on top of the page,

here is what is happening currently...

here is what I want to happen (I used the above image as the 'image' in this... I hope that is not confusing.

Is it possible for me to wrap multiple divs with text in them around this image while maintaining vertical alignment of the names to their value? I am a little rusty in my CSS but I am not sure this can be done (at least not in the way I set it up here)

        .content-col {
            display: inline-block;
            vertical-align: top;
            padding: 2px 2px 2px;
        }

        .content-key {
            width: 30%;
            font-weight: bold;
        }

        .content-value {
            width: 65%;
        }

        hr{
            margin-left: 10px;
            margin-right: 10px;
        }
        .imageDiv{
            background-color: pink;
            width: 200px;
            height: 200px;
            object-fit: contain;
            float: right;
            margin-left: 5px;
        }
   

<div class="imageDiv" ></div>

<div style="width: 100%;">
    <div class="content-col content-key">Attribute Name Test</div>
    <div class="content-col content-value">
        This is where the attribute value and description will be.
        This is where the attribute value and description will be.
        This is where the attribute value and description will be.
        This is where the attribute value and description will be.
        This is where the attribute value and description will be.
    </div>
</div>
<hr />
<div style="width: 100%;">
    <div class="content-col content-key">Attribute Name Test</div>
    <div class="content-col content-value">
        This is where the attribute value and description will be.
        This is where the attribute value and description will be.
        This is where the attribute value and description will be.
        This is where the attribute value and description will be.
        This is where the attribute value and description will be.
    </div>
</div>
<hr />

Answer 1

等待大神解答