表格不是以IE为中心，而是以其他浏览器为中心答案

【问题标题】：Table is not centered on IE, but is centered on other browsers表格不是以IE为中心，而是以其他浏览器为中心
【发布时间】：2020-01-15 17:32:40
【问题描述】：

我有一个表在 Internet Explorer 上向右偏移，但以其他浏览器（Edge、Firefox、移动）为中心。我正在使用引导程序，但在查找 IE 中的对齐方式时遇到问题。

<div class="container body-content body-padding">
        <div class="row">
            <div class="col-auto">
                <p class="breadcrumbs">
                    <a href="index.html" class="">Home</a> /
                    <a href="#" class="">Services</a> /
                    <a href="#" class="">Rates</a>
                </p>
            </div>
        </div>
        <div class="row row-spacing-reduced">
            <div class="col">
                <hr>
            </div>
        </div>
        <div class="row">
            <div class="col text-center">
                <h1 class="spage-header mt-5">Rates</h1>
            </div>
        </div>
        <div class="row mt-5 justify-content-center">
            <div class="col rates-col">
                <table class="table table-striped">
                    <thead>
                        <tr class="table-info">
                        <th scope="col">Service</th>
                        <th scope="col">Charge</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>Lots of rows</td>
                            <td>Condensed version</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div class="row justify-content-center">
            <div class="col rates-col">
                <p class="spage-text no-padding">....</p>
                <p class="spage-text mb-5">....</p>
                <h3 class="spage-subheader no-padding">Our Guarantee</h3>
                <p class="spage-text no-padding">...</p>
            </div>
        </div>

    </div>

【问题讨论】：

你测试的是哪个版本的IE？
这是 Internet Explorer 11

标签： html css bootstrap-4

【解决方案1】：

我不确定为什么它不适合你，因为我在 IE 中打开了你的代码并且它以我为中心。并且以 Chrome、Firefox、Opera 和 Edge 为中心。

见图片here

我唯一的建议是仔细检查您是否在 <head> 标签内使用了最新的 Bootstrap CSS 链接。在本文发布时，这是当前版本：

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

尝试一下，看看是否有效。

我还测试了使用和不使用他们的 JS、Popper.js 和 jQuery 脚本，它们没有任何影响。所以我猜这与你的风格有关。

【讨论】：

【解决方案2】：

我以前遇到过这个问题，如果您使用带有响应式<meta> 属性的<head>，请确保响应式属性位于<head> 属性的第一行。

Internet Explorer 已经过时并且不再真正被使用，这可能是 IE 的代码支持问题，因为它已经不再被支持了好几年了。

您也可以尝试在 IE 上重置您的浏览数据，以获得最佳的代码效果。就个人而言，如果它适用于所有更大的搜索软件（Chrome、Edge、Firefox）和移动设备，我根本不会担心 IE。

希望第一段对你有所帮助:)

【讨论】：