Safari的引导程序列+垂直制表符被干扰

Question

首先，我不（也对此不高兴）拥有Apple的任何东西。但这也给我带来了一个问题，现在看来，当使用Apple的Safari浏览器查看新网站时，无法正确显示。有在线工具可以在不同的浏览器和操作系统中查看网站，但是很难找到问题所在。因此，我希望这里的某人对这个问题有任何经验，并且知道如何解决此问题。

此图片是我的一位客户发送的

但是它看起来应该像（https://torza.nl/portfolio_torza.php）

我认为这是css问题。这是tabs css

.ui-tabs-vertical {
    width: 75em; 
}

.ui-tabs-vertical .ui-tabs-nav {
    padding: .2em .1em .2em .2em;
    float: left;
    width: 12.5em;
}

.ui-tabs-vertical .ui-tabs-nav li {
    clear: left; width: 100%;
    border-bottom-width: 1px !important;
    border-right-width: 0 !important;
    margin: 0 -1px .2em 0;
    border-radius: 4px;
}

.ui-tabs-vertical .ui-tabs-nav li a {
    display:block; }

.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active {
    padding-bottom: 0;
    padding-right: .1em;
    border-right-width: 1px;
}

.ui-tabs-vertical .ui-tabs-panel {
    padding: 1em;
    float: right;
}

.ui-tabs .ui-tabs-nav {
    background:#FFFFFF !important;
    border: none;
}

.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
  padding-left: 2px !important;
  width: 100% !important;
}

我已尝试删除class d-flex，因为这是同一网站另一页上的问题。但这不是解决方案。

页

  <div class="col-lg-12 about-content">

    <div id="tabs" style="border: none;">

      <div class="row">
          <div class="col-lg-2">
              <ul>

                <?php foreach($menu_array as $menu){ $i++; echo '<li><small><a href="#tabs-'.$i.'"><span style="display:inline-block; width:155px;">'.$menu[1].' '.$menu[2].'</span></a></small></li>'; } ?>

              </ul>
          </div>

          <div class="col-lg-10">

             <?php foreach($menu_array as $menu) { $j++; echo '<div id="tabs-'.$j.'">';

                $title = $menu[2];

                include('includes/header_portfolio_torza_web.php');

                if(file_exists('includes/portfolio_torza/page_'.$menu[0].'.php')) { include('includes/portfolio_torza/page_'.$menu[0].'.php'); }
                else { include('includes/portfolio_torza/page_00.php'); }

                include('includes/footer_portfolio_torza_web.php');

                echo '</div>';
             }
             ?>

         </div>

    </div>

  </div>

其中一个页面：

<div class="row">

    <?php
    if($title == '') { echo '<div class="col-lg-12 d-flex flex-column justify-content-center"><h1 class="text-center">'.$pdf_title.'</h1></div>'; }
    ?>

    <div class="col-lg-12 d-flex flex-column justify-content-center">

        <p class="description" style="font-size: 14px;">
        Tegenwoordig versturen veel bedrijven online nieuwsbrieven naar hun klanten en werknemers. Deze nieuwsbrieven informeren lezers over updates binnen het bedrijf en leveren informatie die eraan verbonden is. Bovendien spelen nieuwsbrieven een rol in het opbouwen en in stand houden van de relaties met klanten<br >
        <br />
        In het Torza systeem is het mogelijk om elke aangemaakte contactpersoon direct toe te voegen aan een externe nieuwsbriefservice, zoals Mailchimp.
        </p>

    </div>

</div>

Answer 1

[好，自从我使用Bootstrap以来已经有一段时间了，但是假设您有能力编辑标记，请将<div class="col-lg-10">更改为<div class="col-lg-10" style="margin-right:-1px;">

这可以为我解决（使用devtools）。