Question

我的网站存在问题，因为我想连续调整3个帖子，并希望正确调整到右侧的侧边栏。因为我使用margin-right：18px;在每个块上，它不能移动到右上角，就像在主页上一样：virmodrosti.com

这是问题所在： http://www.virmodrosti.com/?s=minerali

与主页进行比较，您就知道我的意思了。我还添加了图片wordpress theme

目前每个帖子块的宽度为260px，如果我将其更改为264则跳转到下一行，每行只显示2个帖子而不是3个。

在图片上有三个问题需要解决，但我很高兴知道主要问题的解决方案。

请告诉我，谢谢。

Answer 1

您需要为每个第3个.post元素添加css以删除18px边距，如下所示：

#content-a .post:nth-of-type(3n) {
    margin-right: 0;
}

为了计算缺少此边距的宽度，您可以添加：

#content-a .post {
    width: calc(33.33% - 12px);
    /*12px = 18px margin * 2 and divided by the three columns)*/
}

由于您的页面分为两列，因此值得在媒体查询中包含上述两个代码段，例如：

@media only screen and (min-width: 1000px){
    #content-a .post {
        width: calc(33.33% - 12px);
    }
    #content-a .post:nth-of-type(3n) {
        margin-right: 0;
    }
}

如何正确对齐wordpress搜索结果帖子与CSS？

1 个答案: