Firefox和边缘渲染错误或错误。需要修复

Question

我正在制作网站，我想要7 divs，75px身高和width:100%;。现在。在那些div中，还有很多其他的div，但我认为这不值得......

现在。它在我尝试的每个浏览器中运行良好，但在Edge和firefox中看到错误。看起来前两个div很棒，但是，它们突然出错了（其他div [2-7]）。这很难解释，所以我会给你一些照片和LINK给你的网站，所以你可以看到它并理解..（注意！我有两个显示器，每个都有不同的尺寸，所以照片有点奇怪;））

现在，您可以在页面底部看到这个“项目菜单”，只需开始滚动...

当然，有css（可能有帮助）：

html * {
  box-sizing: border-box;
  padding:0;
  margin:0;
}

body {
  height: 100%;
    font-family: 'Open Sans';
    font-weight:100;
    color:#666666;
    line-height: 1.7em;
    background-color: #fff;
}

#full_1{
    width: 100%;
    height: 100%;
    min-height: 100vh;
    background-color: #34495e;
}

.item{
    height: 75px;
    width: 100%;
    background-color: white;
    border-bottom: 2px solid #464646;
}

    .item_roll{
        height: 275px;
    }
    
.box_rotate {
  -webkit-transform: rotate(45deg);  /* Chrome, Safari 3.1+ */
    -moz-transform: rotate(45deg);  /* Firefox 3.5-15 */
      -ms-transform: rotate(45deg);  /* IE 9 */
        -o-transform: rotate(45deg);  /* Opera 10.50-12.00 */
         transform: rotate(45deg);  /* Firefox 16+, IE 10+, Opera 12.50+ */
}
.box_transition {
  -webkit-transition: all 0.3s ease-out;  /* Chrome 1-25, Safari 3.2+ */
     -moz-transition: all 0.3s ease-out;  /* Firefox 4-15 */
       -o-transition: all 0.3s ease-out;  /* Opera 10.50–12.00 */
          transition: all 0.3s ease-out;  /* Chrome 26, Firefox 16+, IE 10+, Opera 12.50+ */
}
    
#date{
    width: 50%;
    float: left;
}

#info{
    width:50%;
    float: left;
    display:none;
}

#plus{
    width: 75px;
    height: 75px;
    float: right;
    padding: 22.5px;
}
    
h1{
    font-size: 30px;
    padding:24px 0px;
    color: #333;
    font-weight: 400;
}

#date h1{
    padding-left: 15px;
}

<div id="timeline">
    <div class="item" style="border-left: 4px solid #8E44AD;">
        <div id="date">
            <h1>31. 5.</h1>
        </div>

        <div id="info">
            <h1>Velikonoční koncert | Přerov | Kulturní dům Rubín</h1>
        </div>

        <div id="plus">
            <img class="plus_x" src="plus.png" style="">
        </div>
    </div>
    <div class="item">
        <div id="date">
            <h1>31. 5.</h1>
        </div>

        <div id="info">
            <h1>Velikonoční koncert | Přerov | Kulturní dům Rubín</h1>
        </div>

        <div id="plus">
            <img class="plus_x" src="plus.png" style="">
        </div>
    </div>
    <div class="item">
        <div id="date">
            <h1>31. 5.</h1>
        </div>

        <div id="info">
            <h1>Velikonoční koncert | Přerov | Kulturní dům Rubín</h1>
        </div>

        <div id="plus">
            <img class="plus_x" src="plus.png" style="">
        </div>
    </div>
    <div class="item">
        <div id="date">
            <h1>31. 5.</h1>
        </div>

        <div id="info">
            <h1>Velikonoční koncert | Přerov | Kulturní dům Rubín</h1>
        </div>

        <div id="plus">
            <img class="plus_x" src="plus.png" style="">
        </div>
    </div>
    <div class="item">
        <div id="date">
            <h1>31. 5.</h1>
        </div>

        <div id="info">
            <h1>Velikonoční koncert | Přerov | Kulturní dům Rubín</h1>
        </div>

        <div id="plus">
            <img class="plus_x" src="plus.png" style="">
        </div>
    </div>
    <div class="item">
        <div id="date">
            <h1>31. 5.</h1>
        </div>

        <div id="info">
            <h1>Velikonoční koncert | Přerov | Kulturní dům Rubín</h1>
        </div>

        <div id="plus">
            <img class="plus_x" src="plus.png" style="">
        </div>
    </div>
    <div class="item">
        <div id="date">
            <h1>31. 5.</h1>
        </div>

        <div id="info">
            <h1>Velikonoční koncert | Přerov | Kulturní dům Rubín</h1>
        </div>

        <div id="plus">
            <img class="plus_x" src="plus.png" style="">
        </div>
    </div>
</div>