问将图像对齐到一列文本，同时保持其响应性

EN

我正在尝试在Wordpress中编写一个类时间表。我附上了一张模拟图片，以更好地说明我正在努力实现的目标。

在下面模拟：

​

​

文本div要么保持在拇指div下面，要么绕在它周围，我的专栏就丢失了。

另外，当进入响应模式时，div不对齐彼此之间的一个，而是将一个叠加在另一个之上。我试着把拇指图像和旁边的一列文字放在一起，就像在图片中一样，让它很好地缩放成小屏幕。

有什么办法可以做到吗？有可能吗？提前谢谢你。

以下是代码：

#text {
width: 33%;
align: left;
clear: both;
}

#thumb {
width: 33%;
align: left;
}

<div id ="thumb"><img src=“---" /></div>
<div id=“text”>NAME OF FIRST CLASS
</div>