在我的博客网站上，这些水平蓝线跨越了我的文本框的宽度。当我的网站达到断点/移动视图时，这些行会弹出框并且是完整的移动浏览器宽度。我无法弄清楚是什么原因造成的。
.date {
font-family: sans-serif;
font-size: 14px;
font-weight: 500;
color: white;
margin-top: 9px;
opacity: 1;
letter-spacing: 3px;
text-transform: uppercase;
background-color: #55565a;
padding: 10px;
margin-left: -42px;
margin-right: -40px;
padding-left: 40px;
display: block;
background: #0076a9;
background:url(data: image/svg+xml;
base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwNzZhOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijk4JSIgc3RvcC1jb2xvcj0iI2Y4ZjlmYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(left, #0076a9 0%,#f8f9fc 98%);
background: -webkit-gradient(linear,left top,right top,color-stop(0%,#0076a9),color-stop(98%,#f8f9fc));
background: -webkit-linear-gradient(left, #0076a9 0%,#f8f9fc 98%);
background: -o-linear-gradient(left, #0076a9 0%,#f8f9fc 98%);
background: -ms-linear-gradient(left, #0076a9 0%,#f8f9fc 98%);
background: linear-gradient(to right, #0076a9 0%,#f8f9fc 98%);
filter:progid: DXImageTransform.Microsoft.gradient( startColorstr='#0076a9',endColorstr='#f8f9fc',GradientType=1 ) /* W3C */ }
