Как переместить текст вверх рядом с изображением ⇐ CSS

[Anonymous]

Красная линия должна располагаться внутри синей линии
Точно так
Я не знаю, как это исправить с помощью метода «float», потому что когда я читаю много В учебниках они говорили, что мне нужно использовать метод с плавающей запятой, но когда я использую метод с плавающей запятой, он переходит в нижнюю часть изображения, и я не знаю, как это исправить. Вы можете использовать другие методы
Вот код:
HTML:

Код: Выделить всё

.lastpart{
background-color: #f7f7f7;
}
.lastpart {
display: grid;
grid-template-columns: auto auto;
grid-template-rows: auto auto;
background-color: rgb(236, 236, 236);
padding: 10px;
}
.grid-item-cer {
background-color: rgba(255, 255, 255, 0.886);
border: 1px solid rgba(0, 0, 0, 0.8);
padding: 20px;
font-size: 30px;

}

.certify{
font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
font-weight: lighter;
font-size: 20px;

padding-bottom: 40px;
}
.spec{
border-right: 1px solid #d6c08d;
}
.s{
display: inline-block;
border: 1.5px solid black;
}
.giaikk{
font-weight: bold;
color: black;
font-size: 15px;
font-family:'Courier New', Courier, monospace;
float: right;

}
.provekk{
font-weight: bold;
color: black;
font-size: 15px;
font-family:'Courier New', Courier, monospace;
background-color: red;
float: left;

}

Код: Выделить всё

Chứng Chỉ - Giải Thưởng
[img]s.jpg[/img]
    width="150px"
height="200px"
>
ĐẠT GIẢI KHUYẾN KHÍCH KHỐI 7 TOÀN QUỐC - IOE
-Chứng chỉ được cấp bỏi Internet Olympiads of English

Подробнее здесь: https://stackoverflow.com/questions/784 ... -the-image