C# 多行图像链接

我已经15年没有开发过网页/应用程序了，而且已经发生了很多变化。我在Visual Studio 2019、ASP.NET和razor页面中工作

如果屏幕不够宽，我想创建一组有边框和环绕的链接。我以为这很简单，但我想不出来。我花了整整一周的时间在这上面，也许我没有寻找正确的术语，或者我真的不知道我在寻找什么

我可以接近一个表格，比如（1行，多个单元格）：

A1:@item.Test1
A2:@item.Test2
@项目1.注1
@项目1.2注2

目前的方法有两个问题

当屏幕宽度太小时，它不会缠绕

只有项目说明可单击

我将图像放在背景中，因为文本中的一些值（item.Test1，item.Test2）将文本推到左侧覆盖图像

有什么建议吗

---

也许让我来点代码，动态生成我正在寻找的图像（我更喜欢CSS解决方案，但创建图像是可以接受的）。

我最终想到的答案是放下表格，将链接（按钮）包装在一个段落中，用按钮替换td标记，给它一个onclick='location'，并保持相同的样式和子表布局

---

现在，按钮可以根据不同的屏幕大小进行包装，并且具有与包装在表格中的旧按钮相同的外观和感觉。

将所有表格包装在一个大的

标签中。如果它破坏了外观，请使用

样式

显示：块

为什么在您显然试图使其响应的东西中使用具有固定尺寸的表格？@irishchiefan:表格不是必需的，我只是因为知识有限才使用它们。

<td style="
                width:128px;
                height:80px;
                border:2px solid black;
                font-size:xx-small;
                background-repeat:no-repeat;
                background-size:64px;
                background-image:url(/Icons/@item.Icon);
            ">
    <table>
        <tr><td style="text-align:right; width:120px"><b>A1: @item.Test1</b></td></tr>
        <tr><td style="text-align:right;"><b>A2: @item.Test2</b></td></tr>
        <tr><td style="text-align:right;"><b>@item.Note1</b> &nbsp;<img src="/Icons/@item.State1a" height="8" width="8" />&nbsp;<img src="/Icons/@item.State2a" height="8" width="8" /></td></tr>
        <tr><td style="text-align:right;"><b>@item.Note2</b> &nbsp;<img src="/Icons/@item.State1b" height="8" width="8" />&nbsp;<img src="/Icons/@item.State2b" height="8" width="8" /></td></tr>
    </table>
    <a href="/Details?item=@item.Id">
        @item.Description
    </a>
</td>