php - 强制 2 个图像链接在同一行

Question

我有一个包含 4 个图像的链接，我需要它以 2x2 格式显示图像......我已经这样做了：

echo '<a id="myImgId" class="myImg"  href="javascript: submitform()">';
    while  (($num_images > 0) && ($num_images <= $max_images))
    {
        if($num_images == ($max_images/2)) { echo '<br />';}
        echo '<img class="nomarge" alt="" id="updateimage' . $num_images . '" name="adBanner' . $num_images . '" src="rsz_image' . $num_images . '.jpg" />';
        $num_images--;
    }
echo '</a>';

好的，br 将 2 个图像顶部和 2 个向下分开。我的问题是，当图像尺寸太大时，我每行只有一个图像，而不是 2 个。我想强制它们在同一行，即使窗口太小....

第一次尝试

.myImg {
    overflow-x:auto;
}

第二次尝试

.myImg {
    overflow:auto;
}

第三次尝试

.myImg {
     overflow:visible;
}

Answer 1

echo '<a id="myImgId" class="myImgId" href="javascript: submitform()">';
echo '<ul>';
    while  (($num_images > 0) && ($num_images <= $max_images))
    {                                                                     
        if($num_images == ($max_images/2)) { echo '</ul><ul style="padding:0 0 0 0;border:0 0 0 0;margin:0 0 0 0;">';}
        echo '<li><img class="nomarge" alt="" id="updateimage' . $num_images . '" name="adBanner' . $num_images . '" src="rsz_image' . $num_images . '.jpg" width="' . $ver  . '" height="' . $hor . '"/><li>';
        $num_images--; 
    }
echo '</ul>';
echo '</a>';

CSS

ul {
    padding: 0;
    margin: 0;
    border:  0;
    display: table;
    table-layout: fixed;
    display: inline;   
}

li {
    padding: 0;
    border: 0;
    margin: 0;  
    display: table-cell;      

}
img {
  max-width: 100%;
  border: 0;
  width: auto\9;
  height: auto;
  display: block;
}

就这么简单……我想，它对我有用！谢谢你们

Answer 2

为什么不生成表格？

更简单，更快，也更...代码友好。

        <tr>
             <td>
                <img />
             </td>
             <td>
                <img />
             </td>
        </tr>
        <tr>
            <td>
                <img />
            </td>
            <td>
                <img />
            </td>
         </tr>