表格显示问题：带图像的块

Question

我正在尝试在我的主页上的图像旁边添加一些文字。因为我希望我的主页能够响应，所以我用一张表来做这个，用这个CSS：

    #tablehomepage {
    display: table;
}

#tablehomepage img {
    min-width: 280px;
    min-height: 190px;
}

#tablehomepage body {
    vertical-align: top;
}


@media (max-width: 920px) {
    #tablehomepage td {
        display: block;
    }

完整代码：https://jsfiddle.net/h3jhgns4/1/。奇怪的是这里不会出现问题...

我的图像在第一个单元格中，文本在我的第二个单元格中。只有一排。

我目前遇到的一些问题：

1. 当屏幕低于920时，'display：block'会启动，但会将我的文字放在我的图像上。我希望在较小的屏幕上显示图像下方的文字。
2. 当'display：block'启动时，我的顶部边框下方会出现一些额外的随机边框。
3. 我无法将图像自动缩放到非常适合不同屏幕尺寸的文本旁边。我想这可以通过为该单元格设置静态大小并将图像作为背景放入css来实现，但是我无法设置alt-text（SEO对我来说非常重要）。

Answer 1

尝试将显示设置为inline-block，对于文字，添加clear:booth以便它需要完整的行宽，并且它不在您的图片周围。