IE兼容性，保证金问题答案

【问题标题】：IE Compatibility, margin issueIE兼容性，保证金问题
【发布时间】：2013-01-17 07:03:08
【问题描述】：

我大约一个月前开始在这家公司工作，我一直在努力清理他们的网站。这真是一团糟。我的老板使用 IE，但我使用的是 Chrome，只是有点跑和枪。 jQuery 滑块下方的标题为：“World-Class Mechanical Engineers & Contractors - in Central PA”位于<td> 的最左侧，但另一个 h1 没有。我希望网站在 Chrome 中呈现与在 IE 中相同的效果，但它在 Chrome 中的外观是我想要的。在 Chrome 中，h1 向右拉 40px，以缩进。我在这里错过了什么？

http://www.enginuity-llc.com/index.htm

【问题讨论】：

标签： html css internet-explorer google-chrome margin

【解决方案1】：

您的标记无效。请注意下面 sn-p 的第二行如何有一个以 h1 作为子元素的 table 元素。

<tr>
    <td height="50" colspan="2" valign="bottom"><table width="100%" border="0" cellspacing="0" cellpadding="0">
        <h1 style="margin-left:40px">World-Class Mechanical Engineers & Contractors - in Central PA</h1>
        <p style="margin-left:50px; margin-right:75px">Enginuity, LLC is a local firm with decades of global experience in the HVAC and Plumbing sectors. Whether you're looking for a custom process design/build, a retrofit to existing HVAC equipment, service                  and maintenance, or sustainable energy solutions, Enginuity-LLC is your ultimate one-stop partner. What began in 2002 with four mechanical contracting veterans, has grown into an 85-strong firm that still delivers the best design, service, and                         support in the business.</p>
        <p style="margin-left:50px; margin-right:75px">Enginuity-LLC is more than just your local Energy Star Partner & MSCA Green-Star Recipient; we're your solutions provider for the life of your building. We've worked with large enterprises and small businesses, but regardless of what you need, you'll find a level of professionalism and experience unmatched in the HVAC, Plumbing, and Mechanical Contractor market.</p>
        <h1 style="margin-left:40px">We Specialize in:</h1>
            <table style="margin-left:80px">
                <tr>
                    <td width="180px">
                        <ul>
                        <li>HVAC</li>
                        <li>Plumbing</li>
                        <li>Medical Gas Piping</li>
                        <li>Pneumatic</li>
                        <li>Hydraulics</li>
                        <li>Steam</li>
                        <li>Compressed Air</li>
                        <li>Process Piping</li>
                        <li>Refrigeration</li>
                        <li>Utility Piping</li>
                        <li>Ventilation</li>
                        </ul>               
                    </td>
                    <td width="220px">
                        <ul>
                        <li>Centrifugal Chillers</li>
                        <li>Special Environments</li>
                        <li>Specialty Fabrication</li>
                        <li>Backflow Preventers</li>
                        <li>Fire Damper Inspection</li>
                        <li>Sheet Metal / Ductwork</li>
                        <li>New Construction</li>
                        <li>Tenant Fitouts</li>
                        <li>Restoration</li>
                        <li>Turn-Key Design / Build</li>
                        <li>Preventative Maintenance</li>
                        </ul>               
                    </td>
                    <td width="220px">
                        <ul>
                        <li>Energy Retrofits</li>
                        <li>Energy Optimization</li>
                        <li>Computer Rooms</li>
                        <li>Climate Control</li>
                        <li>Radiant Floor Systems</li>
                        <li>Geothermal Systems</li>
                        <li>Energy Audits / Benchmarking</li>
                        <li>Fire Damper Inspection</li>
                        <li>Liebert Certified Data-Aire</li>
                        <li>Electrical Controls</li>
                        <li>DDC</li>
                        </ul>               
                    </td>
                </tr>
            </table>
            <br>
        </td>
    </tr>

<td align="left" width="800px">

另外，如果你在 IE 中打开开发者工具 (F12)，你会注意到它在那个区域很奇怪（对我来说它显示了一个孩子，这是不可能的）

【讨论】：

【解决方案2】：

您可以使用 CSS 重置，然后设置自己的边距。

重置样式表的目的是减少浏览器在诸如默认行高、页边距和标题字体大小之类的东西，等等。

http://meyerweb.com/eric/tools/css/reset/

【讨论】：