Fatal编程技术网
  • html/
  • Html 图像[通过CSS的背景图像]未在IE7中呈现

Html 图像[通过CSS的背景图像]未在IE7中呈现

html css internet-explorer

Html 图像[通过CSS的背景图像]未在IE7中呈现,html,css,internet-explorer,internet-explorer-7,Html,Css,Internet Explorer,Internet Explorer 7,我需要一些帮助来解释IE7为什么不会在下面的HTML/CSS代码中呈现我的图像 <html> <head> <meta name="generator" content="HTML Tidy for Linux (vers 25 March 2009), see www.w3.org" /> <title>Debugging IE 7 image problem</title> <styl

我需要一些帮助来解释IE7为什么不会在下面的HTML/CSS代码中呈现我的图像

<html>
   <head>
      <meta name="generator" content="HTML Tidy for Linux (vers 25 March 2009), see www.w3.org" />
      <title>Debugging IE 7 image problem</title>
      <style>
         .delete-icon
         {
         background-image: url("http://cdn4.iconfinder.com/data/icons/momenticons-basic/16x16/trash-can-delete.png");
         background-position: top right;
         background-repeat: no-repeat;
         padding-right: 18px;
         margin-left: 7px;
         }
      </style>
   </head>
   <body>
      <table id="table_Locations">
         <tbody>
            <tr>
               <td></td>
               <td></td>
               <td></td>
            </tr>
            <tr class="div-input-default" id="LocationsTest2">
               <td>
                  <select name="AllTests_Locations_Substance_2" id="LocationsTest2">
                     <option value="641">Okuku</option>
                     <option value="644">Oyan</option>
                     <option value="645">Ikirun</option>
                     <option value="646">Oshogbo</option>
                  </select>
               </td>
               <td>
                    <input id="LocationsTestResults2_negative" name="AllTests_Locations_Result_2" value="776" type="radio" />Negative <input id="LocationsTestResults2_positive" name="AllTests_Locations_Result_2" value="777" type="radio" />Positive<br />
                    </td>
               <td>
                    <a class="delete-icon" href="#"></a>
               </td>
            </tr>
         </tbody>
      </table>
   </body>
</html>
这在IE8、IE9、Firefox和Chrome中表现良好，但在IE7中表现不佳。如何更改此标记以使其在IE7中工作？谢谢。

尝试将宽度和高度设置为。删除图标样式

尝试以下操作：

.delete-icon {
         background: url("http://cdn4.iconfinder.com/data/icons/momenticons-basic/16x16/trash-can-delete.png") no-repeat right 0;
         display: inline-block;
         width: 100px; /* set to whatever you need */
         height: 100px; /* set to whatever you need */
         padding-right: 18px;
         margin-left: 7px;
}
关键是为锚定标记提供正确的显示值加上宽度和高度

我还建议您不要将表格用于布局目的，因为这至少已有10年或更长时间没有得到很好的实践。

谢谢，但这不起作用，我认为不会。只是想确认一下。谢谢，为什么请投反对票？谢谢，我很清楚使用表格进行布局的相关问题，并尽可能避免使用表格。但最重要的是，你的解决方案对我来说很有效——显示器和宽度/高度的组合起到了关键作用——而不仅仅是卡帕建议的宽度/高度（尽管这要感谢他）。谢谢again@pi. - 没问题，很高兴能帮上忙。