Смещение в 1 пиксель для столбцов bootstrap только в Safari - PullRequest
0 голосов
/ 10 января 2020

первый вопрос-вопрос здесь.

Недавно я собрал веб-сайт (https://oralhealthnc.org) через WordPress, и я застрял на очень маленькой проблеме, когда он отображается в Safari.

У меня есть три кнопки в верхней части сайта, которые охватывают всю ширину экрана. Во всех веб-браузерах, кроме Safari, они отображаются идеально, но в Safari они смещены на один пиксель вправо. Это небольшая проблема, но она ведет меня к стене!

Вот несколько скриншотов вопроса

Вот код:

<div class="tmpl-contact-10 boldgrid-section dynamic-gridblock" style="margin: 0px;">
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-4 col-xs-12 col-sm-4 color1-background-color color-1-text-contrast bg-background-color" style="background-image: url('https://oralhealthnc.org/wp-content/uploads/2019/12/Header_Button01.png'); background-size: cover;" onclick="location.href = 'https://oralhealthnc.org/who-we-are/';">
                <h2 style="color: #ffffff;">WHO WE ARE</h2>
            </div>
            <div class="col-md-4 col-xs-12 col-sm-4 color1-background-color color-2-text-contrast bg-background-color" style="background-image: url('https://oralhealthnc.org/wp-content/uploads/2019/12/Header_Button02.png'); background-size: cover;" onclick="location.href = 'https://oralhealthnc.org/join/';">
                <h2 class="" style="color: #ffffff;">JOIN NCOHC</h2>
            </div>
            <div class="col-md-4 col-xs-12 col-sm-4 color1-background-color color-3-text-contrast bg-background-color" style="background-image: url('https://oralhealthnc.org/wp-content/uploads/2019/12/Header_Button03.png'); background-size: cover;" onclick="location.href = 'https://oralhealthnc.org/resource-center/';">
                <h2 style="color: #ffffff;">RESOURCE CENTER</h2>
            </div>
        </div>
    </div>
</div>

Буду очень признателен за любые советы, я в полном недоумении!

...