注入自定义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;
}

或

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

或上面的许多排列

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

我的方法有缺陷吗？你能用一个补丁作为例子吗(我想学习！)

谢谢!

(1)和(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

我看到你解决了你的问题，我确实在你的网站上看到了一个问题。对于大屏幕，如果屏幕大于1800 is，就会出现一个白条。

​

​

您可以通过在CSS中找到这段代码来解决这个问题。

.sidebar-container

加上

display:none;

​

​

您可以在浏览器中通过缩放来测试这一点，直到条形图出现。干杯