css - 我无法让我的移动版网站完全居中

Question

我的网站左侧有一些奇怪的空间问题。出于某种原因，在移动视图中左侧的空间比右侧的空间稍大，因此看起来偏心。我猜它也适用于桌面视图，但它并不明显。我无法弄清楚是什么造成了这种情况。http://jeffreydowellphotography.com/

/* ---------->>> MOBILE gap/space issues <<<-----------*/

@media screen and (max-width: 400px) {

#pageWrapper { margin: 0;}

.sqs-layout .sqs-row .sqs-block:last-child {
     padding-bottom: 0;
     padding-top: 0;
  }}



/* ---------->>> MOBILE center logo <<<-----------*/

@media only screen and (max-width: 400px) {

        h1.logo {
            text-align:center;  
            margin-bottom: 20px !important;
            }}



/* ---------->>> MOBILE logo size <<<-----------*/

@media only screen and (max-width: 400px) {


.logo-image .logo img { 
    max-height: 110px;
    margin: 5px;
    width: auto;
  }

.social-links {
    padding-top: 20px; 
  }}

Answer 1

尝试在您的移动样式中删除margin: 5px;on 。.logo-image .logo img带有边距的图像可​​能比包含图像的 div 宽，并且它会因为未居中而脱落。

更新

我查看了您的网站，它实际上是 .slide 选择器上的边距。将此添加到您的移动样式中：

 .slide { margin: 0; }