Как исправить разницу в высоте между Chrome и Safari? - PullRequest
Новая
       12

Как исправить разницу в высоте между Chrome и Safari?

0 голосов
/ 25 октября 2019

Я видел различия в div моего роста между несколькими браузерами. В Google Chrome он работает отлично, но в Safari есть разница, как вы можете видеть на скриншотах: div-screen-chrome

div-screen-safari

Вот мой код: 

.player {
        bottom: 0;
        position: fixed;
        width: 100%;
        height: 55px;
        background-color: grey;
        color: white;
        font-family: 'Oswald';
        line-height: 50px;
    }
    
    .next-container {
        position: relative;
        float: right;
        padding-right: 10px;
        padding-left: 10px;
        font-size: 15px;
        height: 55px;
        top: -53px;
        max-width: 50%;
        min-width: 20%;
        background-color: #ffc107;
        color: white;
        line-height: 55px;
        text-align: center;
      }
<div class="player">
  <div class="artist-title-infos">
    <span class="cover"><img class="picture" src="http://my-cover" alt="cover"></span>
    <div class="infos">
      <button class="buttonPlayer notPlaying"><i id="iconPlayer" class="fas fa-play-circle"></i></button>
      <button class="pausePlayer notPaused"><i id="iconPlayer" class="fas fa-pause-circle"></i></button>
      <span class="artist">Now : </span>
      <span class="title">Your song</span>
     </div>
    </div>
   <div class="next-container">
    <span class="next">Next : </span>
    <span class="next next-songs-0">Your song 1</span>
    <span class="next next-songs-1">, Your song 2</span>
    <span class="next next-songs-2"> & Your song 3</span>
   </div>
</div>

Как это исправить?

Спасибо

...