将正文中的博客文章向左对齐

Question

我正在使用第三方模板。对于我的博客文章，桌面上的显示还可以。但在移动版本（平板电脑和手机）上，帖子正文是右对齐的。我希望它向左移动。

@media only screen and (max-width: 780px) {
.picsizer {
width: 100%;
}
.fullwrap {
  position: relative;
}
.post-outer {
width: 100%;
}
#stickyme {
    width: 100%;
}
.labelblog .post-outer {
    padding-left: 40px;
    padding-right: 40px;
}
}

    ~~~~<div class="separator" style="clear: both; text-align: center;">
<a href="https://1.bp.blogspot.com/-z541xJZy8o4/XT0QfBsglbI/AAAAAAAABKU/LcYLqVn4A1MMDRODOxLeewRDDasnVCq0gCKgBGAs/s1600/famous.png" imageanchor="1" ><img border="0" src="https://1.bp.blogspot.com/-z541xJZy8o4/XT0QfBsglbI/AAAAAAAABKU/LcYLqVn4A1MMDRODOxLeewRDDasnVCq0gCKgBGAs/s320/famous.png" width="320" height="320" data-original-width="636" data-original-height="636" /></a></div>
<link rel="stylesheet" href="https://s3.amazonaws.com/canvas-chess/source/pgn.min.css">
<script src="https://s3.amazonaws.com/canvas-chess/source/canvaschess-0.1.0.min.js"></script>
<script src="https://s3.amazonaws.com/canvas-chess/source/pgnviewer-0.1.0.min.js"></script>
<script>
    var viewer = new CHESS.PgnViewer({
        pgn_uri: 'https://s3.amazonaws.com/canvas-chess/pgn/lasker_capablanca_1921.pgn',
        piece_set: 'https://s3.amazonaws.com/canvas-chess/pieces/merida'
    });
</script>

....
I added in the html code. Here's the link to the full blog post. It was done a while back and I am doing a fixing of the website.

https://abigaildemo.blogspot.com/2018/10/four-move-checkmates.html

Answer 1

让我试着回答这个问题。

您可以尝试添加：

text-align: left;

在

.post-outher

像这样：

@media only screen and (max-width: 780px) {
    .picsizer {
        width: 100%;
    }
    .fullwrap {
        position: relative;
    }
    .post-outer {
        width: 100%;
        text-align: left;
    }
    #stickyme {
        width: 100%;
    }
    .labelblog .post-outer {
        padding-left: 40px;
        padding-right: 40px;        
    }
}

或者因为你不能提供一个例子来说明如何将你的 CSS 代码实现为 HTML 代码。

@media only screen and (max-width: 780px) {
    .picsizer {
        width: 100%;
    }
    .fullwrap {
         position: relative;
    }
    .post-outer {
        width: 100%;
    }
    #stickyme {
        width: 100%;
    }
    .labelblog .post-outer {
        padding-left: 40px;
        padding-right: 40px;
        text-align: left;
    }
}

我希望这对你有用。