Html 未在IE7,8,9中渲染的内联样式

Html 未在IE7,8,9中渲染的内联样式,html,css,internet-explorer,background,inline-styles,Html,Css,Internet Explorer,Background,Inline Styles,我知道有1000篇文章有这样的问题,但他们似乎没有解决我的问题。我在一个网站上工作,这个网站是在我来到这家公司之前创建的,他们基本上有一个占位符来向网站添加“小部件”。当用户单击“添加小部件”时,它会显示它们的滚动列表。在IE5(怪癖模式)中,它以某种方式与小部件完美配合,但之后的任何操作都不起作用。它只显示“AddWidgetContainer”div,但不显示其中的div元素。这是代码。没有外部css,因为它们是内联的,因为图像对于每个用户都是不同的。我已经测试通过,图像和一切都可以通过服务

我知道有1000篇文章有这样的问题,但他们似乎没有解决我的问题。我在一个网站上工作,这个网站是在我来到这家公司之前创建的,他们基本上有一个占位符来向网站添加“小部件”。当用户单击“添加小部件”时,它会显示它们的滚动列表。在IE5(怪癖模式)中,它以某种方式与小部件完美配合,但之后的任何操作都不起作用。它只显示“AddWidgetContainer”div,但不显示其中的div元素。这是代码。没有外部css,因为它们是内联的,因为图像对于每个用户都是不同的。我已经测试通过,图像和一切都可以通过服务器,但不显示

<div style="margin-left:10px; height:78px; min-height:78px;" id="AddWidgetContainer">

                                <div id="addaccstats" class="WidgetPanel" style="width:190; height:78; display:none; float:left; background:url(/applications/images/widgets/add/account-statistics.png); background-repeat:no-repeat;">
                                    <a class="AddWidgetAddButton" href="#" onClick="addWidget('accstats')"></a>
                                </div>

                                <div id="addacct_wiz" class="WidgetPanel" style="width:190; height:78; display:none; float:left; background:url(/applications/images/widgets/add/account_wizard.png); background-repeat:no-repeat;">
                                    <a class="AddWidgetAddButton" href="#" onClick="addWidget('acct_wiz')"></a>
                                </div>

                                <div id="addalerts" class="WidgetPanel" style="width:190; height:78; display:none; float:left; background:url(/applications/images/widgets/add/Alerts.png); background-repeat:no-repeat;">
                                    <a class="AddWidgetAddButton" href="#" onClick="addWidget('alerts')"></a>
                                </div>

                                <div id="addassets" class="WidgetPanel viewable" style="width:190; height:78;  display:inline; float:left; background:url(/applications/images/widgets/add/assets_under_mgmt.png); background-repeat:no-repeat;">
                                    <a class="AddWidgetAddButton " href="#" onClick="addWidget('assets')"></a>
                                </div>

                                <div id="addbiz_snap" class="WidgetPanel viewable" style="width:190; height:78;  display:inline; float:left; background:url(/applications/images/widgets/add/biz_snapshot.png); background-repeat:no-repeat;">
                                    <a class="AddWidgetAddButton" href="#" onclick="addWidget('biz_snap')"></a>
                                </div>

                                <div id="addcomm_snap" class="WidgetPanel viewable" style="width:190; height:78;  display:inline; float:left; background:url(/applications/images/widgets/add/commissions_snapshot.png); background-repeat:no-repeat;">
                                    <a class="AddWidgetAddButton" href="#" onclick="addWidget('comm_snap')"></a>
                                </div>

                                <div id="addevents" class="WidgetPanel viewable " style="width:190; height:78;  display:inline; float:left; background:url(/applications/images/widgets/add/conferences_events.png); background-repeat:no-repeat;">
                                    <a class="AddWidgetAddButton" href="#" onclick="addWidget('events')"></a>
                                </div>
                                <div id="addcalc" class="WidgetPanel viewable " style="width:190; height:78;  display:inline; float:left; background:url(/applications/images/widgets/add/tools_calculators.png); background-repeat:no-repeat;">
                                    <a class="AddWidgetAddButton " href="#" onClick="addWidget('calc')" ></a>
                                </div>
                                <div id="addcrm" class="WidgetPanel viewable " style="width:190; height:78;  display:inline; float:left; background:url(/applications/images/widgets/add/crm.png); background-repeat:no-repeat;">
                                                                                                                                                                                                                                    <a class="AddWidgetAddButton" href="#" onclick="addWidget('crm')"></a>
                                </div>

                                <div id="addcrmcal" class="WidgetPanel viewable " style="width:190; height:78;  display:inline; float:left; background:url(/applications/images/widgets/add/calendar.png); background-repeat:no-repeat;">
                                                                                                                                                                                                                                    <a class="AddWidgetAddButton" href="#" onclick="addWidget('crmcal')"></a>
                                </div>

                                <div id="adddocs" class="WidgetPanel" style="width:190; height:78;  display:none; float:left; background:url(/applications/images/widgets/add/Documents.png); background-repeat:no-repeat;">
                                                                                                                                                                                                    <a class="AddWidgetAddButton" href="#" onClick="addWidget('docs')"></a>
                                </div>

                                <div id="addecbr" class="WidgetPanel viewable" style=" width:190; height:78;  display:inline; float:left; background:url(/applications/images/widgets/add/ecbr.png); background-repeat:no-repeat;">
                                                                    <a class="AddWidgetAddButton" href="#" onClick="addWidget('ecbr')"></a>
                                </div>

                                <div id="addfollow" class="WidgetPanel" style="width:190; height:78;  display:none; float:left; background:url(/applications/images/widgets/add/Follow_up_required.png); background-repeat:no-repeat;">
                                                                                                                                                                                                                                    <a class="AddWidgetAddButton " href="#" onClick="addWidget('follow')"></a>
                                </div>

                                <div id="addforms" class="WidgetPanel viewable" style="width:190; height:78;  display:inline; float:left; background:url(/applications/images/widgets/add/forms.png); background-repeat:no-repeat;">
                                                                                                                                                                                                                                    <a class="AddWidgetAddButton" href="#" onClick="addWidget('forms')"></a>
                                </div>

                                <div id="addholidays" class="WidgetPanel viewable" style="width:190; height:78;  display:inline; float:left; background:url(/applications/images/widgets/add/holidays_events.png); background-repeat:no-repeat;">
                                                                                                                                                                                                                                    <a class="AddWidgetAddButton" href="#" onClick="addWidget('holidays')"></a>
                                </div>  

                                <table border="0" class="AddWidgetButtonContainer" style="display:inline; float:left; line-height:30px; vertical-align:middle; margin:0; width:950px; height:30px; padding:0;">
                                    <tr><td><a id="ctl00_ContentPlaceHolder1_lnkWidgetAddReset"  class="AddWidgetButtonContainerButton" href="COMMunityLink.asp">Reset to default home page</a></td>
                                    <td style="text-align:right; float:right; vertical-align:middle;  margin:0px; width:200px; height:30px; "  id="addWidgetCounter"></td>
                                    <td id="paging_buttons" style="width:75px" ><a id="widget_prev" style="background: url('/applications/images/icons/btn_widget_prev.gif') no-repeat; padding:10 12 10 12; width=20px; height:20px; background-position:right" href="#" onClick="prevels();return false"></a>
                                    &#160;
                                    <a id="widget_next" href="#" style="background: url('/applications/images/icons/btn_widget_next.gif') no-repeat; padding:10 12 10 12; width=20px; height:20px; background-position:right" onClick="nextels();return false"></a></td></tr>
                                </table>
            </div>

 
在“怪癖”模式之后,即使是表中的链接元素也无法与背景图像一起正确显示。我还附上了一些照片。 怪癖模式和IE7模式


非常感谢任何帮助

这是因为宽度和高度应该有测量单位,如
px
mm

宽度:190;身高:78=>
宽度:190px;高度:78px应该可以解决您的问题

此外,应用于
内联
元素的宽度没有任何作用。
考虑使用<代码>林林块< /代码>代替div >代码>内联 

和,
padding:1012102
=>
padding:10px 12px 10px 12px
=>
padding:10px 12px

最后:
width=20px
=>
width:20px


这里有一个补丁

一个fiddle将是一个可怕的网站托管在一个ssl上,需要登录,所以你将无法通过fiddle访问图像,我尝试创建这个fiddle,并引用了谷歌图像的股票图像的最后一个图像,但仍然无法正确呈现;我在看这个之前就知道了。谢谢你的帮助和洞察力,我非常感谢!