在表中缩放图像，并将其集中

Question

我想出了如何使图像在表格中扩展，但无法让任何工作以使它们集中在桌子上。

在这里设置演示 - https://jsfiddle.net/4m5vf9zb/

td#divison00,
td#division01 {
    display: table;
    table-layout: fixed;
}
.standingslogo {
    width: 100%;
    max-width: 100%;
}

我需要使它们可扩展，但要居中。不确定如果可能的话，我没有授权更改任何现有的HTML。

Answer 1

我的解决方案不允许图像超出其本地大小，但确实以图像为中心。

第一步是删除此CSS选择器：

td#divison00,
td#division01 {
    display: table;
    table-layout: fixed;
}

然后从.standingslogo中删除width: 100%;。使用width: 100%;迫使图像超出其本地大小（获取所有像素化）并占用其容器的完整宽度（<td>）。

接下来是将图像设置为 display: block;，以便可以使用 margin: 0 auto;进行中心。

最终的.standingslogo CSS选择器应该看起来像这样：

.standingslogo {
    display: block;
    margin: 0 auto;
    max-width: 100%;
}

您更新的JSFIDDLE：https：//jsfiddle.net/4m5vf9zb/1/

编辑

在列出的两个条件下纯CSS解决方案。将width: 100%;添加到.standingslogo将使图像在表格中扩展，但会破坏第二个规则。