-1
Я создаю сайт, используя Bootstrap.Колонки Safari отличаются от Firefox и Chrome
Веб-сайт отлично подходит для Chrome и Firefox.
Но когда я открываю свой веб-сайт в Safari, столбцы проходят дольше, поэтому я получаю огромное количество пробелов на этой странице.
Здесь вы можете увидеть разницу между Chrome и Safari.
Слева - сафари | Правые Chrome
Вот мой HTML и CSS я использую для колонки:
Для столбцов, которые я использую стандартный загрузочный CSS.
.tipsDetails .content {
font-family: "H-Lt", sans-serif;
font-size: 16px;
color: #56565a;
// width: 80%;
margin: 0 auto 150px;
column-count: 2;
\t -webkit-column-break-inside: avoid;
min-height: 1px;
}<div class="container tipsDetails desktop">
\t <div class="row">
\t \t <div class="image img-responsive"><img src="<?php echo $image2[0]; ?>"></div>
\t \t <div class="col-md-12 col-sm-12" style="text-align: center;"><img class="arrow-down2" src="<?php echo get_template_directory_uri();?>/images/arrow_down.png" alt="arrow"/></div>
\t \t <div class="col-md-12 col-sm-12 title"><?php the_title();?></div>
\t \t <div class=" " style="width:75%; margin:0 auto;">
\t \t \t \t \t <div class="col-md-12 col-sm-12 content" id="tipsContent"><?php the_content(); ?></div> \t
\t \t \t \t \t <div class="col-md-12 col-sm-12 content" id="content2" style="display:none;"></div>
\t \t </div>
Пожалуйста, включите сюда фотографии и код, не требуя, чтобы мы покинули SO. Anyay, вам понадобится конкретный «если этот браузер, сделайте это», если вы не хотите полагаться на то, как браузеры интерпретируют таблицы стилей. По состоянию на октябрь 2016 года примерно 3,6% пользователей Интернета использовали Safari. Кроме того, разница довольно незначительная, поэтому вам может потребоваться пересмотреть, даже если это дано. Удачи, если вам действительно нужно копаться в нем. - http://www.w3schools.com/browsers/ – Jonast92
Браузеры имеют разные таблицы стилей по умолчанию. Если вам нужен одинаковый внешний вид повсюду, вам необходимо переопределить все значения по умолчанию в вашем CSS. – Barmar