1

我正在开发一个网站，该网站的界面包含一系列 12 个 ASP.NET ImageButton 控件 - 顶部六个，底部六个。这些呈现为<input type="image" />HTML 元素。它们应该从左到右排列，如下面的屏幕截图所示。

12 个图像图标从左到右排列，一行在另一行之上。

直到最近，标记正确地布置了 Firefox、IE 和 Chrome 中的图标。最近一位客户注意到，在 Chrome 中，图像不是水平排列的，而是一个在另一个之上，如下面的屏幕截图所示。

这 12 个图像图标在 Chrome 中一层一层地排列。

您可以在http://fuzzylogicinc.net/demos/snippet.html上看到正在运行的标记。如果您使用 IE 或 Firefox 查看按钮，则按钮布局正确，从左到右。如果您在最新版本的 Chrome 中查看它，按钮会从上到下排列。

显然，标记是相同的，并且上面的演示/片段中的样式很少。我需要做什么才能让它在 Chrome 中运行？

这是图像按钮的（缩写）标记。没有应用其他样式。

<input type="image" name="..." id="..." title="General Invoice" src="..." style="height:20px;border-width:0px;" />

<input type="image" name="..." id="..." title="General Invoice" src="..." style="height:20px;border-width:0px;" />

<input type="image" name="..." id="..." title="General Invoice" src="..." style="height:20px;border-width:0px;" />

...

<br />

<input type="image" name="..." id="..." title="General Invoice" src="..." style="height:20px;border-width:0px;" />

<input type="image" name="..." id="..." title="General Invoice" src="..." style="height:20px;border-width:0px;" />

<input type="image" name="..." id="..." title="General Invoice" src="..." style="height:20px;border-width:0px;" />

...

谢谢！

4

1 回答 1

0

您的 td 宽度导致问题 100% .. 使它成为 - style="white-space: nowrap;" 对于按钮行（第一行）

 <tbody><tr><td>..<td>..
 <td  style="white-space: nowrap;">
 <input type="submit" name="ctl00$Content01$btnGotoOrderNumber" value="Go" .....
于 2013-02-27T04:39:19.047 回答