问题
On my blog siteI have these horizontal blue lines that span the width of my text boxes. When my site hits the breaking point / mobile view, those lines pop out of the boxes and are full mobile browser width. I can't figure out what is causing that.
.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 */ }
回答1:
The article with class "hentry" has padding that goes from 40px to 15px on the 640px breakpoint that messes it up.
Change it to padding: 40px on your 640px(smallest size) breakpoint. It's line 8918 of this file: http://jeffreydowellphotography.com/site.css
来源：https://stackoverflow.com/questions/18499815/why-are-the-blue-lines-in-my-blog-jumping-out-of-the-text-box-in-mobile-view