注入自定义CSS以覆盖特定的对象格式 - 建议

Question

新手在这里。我正在重新学习HTML5上的网页 - 定制一个博客网站来切割我的牙齿。我已经能够从默认值中改变很多（w3schools非常宝贵！）但是在尝试更改特定对象的格式时我遇到了困难。

我无法想出的三件事（网站www.paddlebeforethewave.com）

1）精选帖子（上图） - 图片包装文字是博客文章的默认行为，特色帖子没有遵循。我能够如下更改图像/大小位置 - 但无法弄清楚如何将图像文本换行。

.FeaturedPost .snippet-thumbnail img {
  max-width: 100px;
  float: left;
  margin: 0px;
  padding: 0px;
  display: inline;
}

2）精选帖子（上） - 我想更改仅有特色信息的背景颜色。我试图识别和修改它如下 - 但没有效果。

.Blog .blog-posts .post-outer-container, #page_body .FeaturedPost {
  background: $(posts.background.color);
  min-height: 40px;
 padding: 30px 40px;
 width: auto;
}

OR

.FeaturedPost .bgcolor {
   background-color: #cfe2f3;
}

OR     上面的许多排列

3）内容 - 我创建了第二页（http://www.paddlebeforethewave.com/p/contact.html），并且垂直填充和页面标签位置的格式丢失。

我的方法有缺陷吗？你能用一个例子作为例子（我想学习！）

谢谢你！

Screenshot for (1) and (2)

Answer 1

1）将以下代码添加到您的主题：

.FeaturedPost .snippet-thumbnail,
.FeaturedPost .post-snippet {
    display: inline;
}

2）您的方法很好，如果您还没有看到任何更改，请尝试清除浏览器缓存。特色帖的正确课程是：

.Blog .post-outer-container, #page_body .FeaturedPost {
 }

3）我不确定我能看到问题。你能提供截图吗？

编辑：

发现它！转到主题代码并将以下属性添加到此类：

.item-view .blog-name {
    -webkit-flex-flow: column;
    flex-flow: column;
}

Answer 2

我看到你修复了我的问题，但是在你的网站上看到了问题。对于大屏幕，如果屏幕大于1800px，则会出现白条。

您可以通过在CSS中找到此代码来解决此问题

.sidebar-container

并添加

display:none;

您可以在浏览器中通过缩小直到条形显示进行测试。干杯