Question

创建了我的第一个wordpress网站，所有内容都经过了样式设置并且正常工作到今天。我们添加了一个ssl，将所有内容切换到https，从那以后我的几个css类不再起作用了。他们中的大多数都这样做，但我在推荐页面上的特定表格和表格的媒体查询的样式不再有效。

在检查网站上的html和css时，html显示元素上的类，css文件显示类及其元素，但是没有应用类。 The testimonals page带有图像和按钮的表格居中，按钮与图像重叠，但现在没有显示。

此表的css为：

table.test {
  width: 66%;
  margin: auto;
}
td.nopad {
  padding: 0 !important;
  margin: auto;
  text-align: center !important;
}
td.nopad-btn {
  padding: 0 !important;
  margin:auto;
  text-align: center !important;
  position: relative;
  top: -10px;
}

和html：

<table class="test">
  <tr>
    <td class="nopad"><img src="https://eyealivedrops.com/wordpress/wp-content/uploads/2015/11/group-people.jpg" alt="group-people" width="290" height="199"  /></td>
    <td class="nopad"><img src="https://eyealivedrops.com/wordpress/wp-content/uploads/2015/11/pets.jpg" alt="pets" width="290" height="199" /></td>
  </tr>
  <tr>
    <td class="nopad-btn"><a href="#people" class="button">People Testimonials</a></td>
    <td class="nopad-btn"><a href="#pets" class="button">Pet Owner Testimonials</a></td>
  </tr>
</table>

但是，该网站没有在页面上显示这些样式，我无法弄清楚原因..

This is the link to the full css file, in case its something somewhere else提前感谢所有关注此事的人，我一直在浏览Q＆amp; A's，但找不到任何适合我的问题。

Answer 1

CSS文件中有错误...

@media screen and (max-width: 767px) {
    table:not(.shop_table.woocommerce-checkout-review-order-table, .shop_table.cart {
        display: block

;
}

你忘了关闭），所以你的CSS的其余部分没有正确加载。

它与http或https无关，因为它在两种情况下都失败了。你可能有更多的CSS问题......我会更进一步。

<强>更新

您也有此错误：

.product-total {
    padding: 0, 10px, 10px, 10px;
}

应该是：

.product-total {
    padding: 0 10px 10px 10px;
}

更新2

这里有另一个错误：

button.button,
input.button,
a.button,
input.wpcf7-form-control.wpcf7-submit {
    background: #AABBD4 !important;
    background-image: -webkit-linear-gradient(#AABBD4, #4873A6);
    background-image: linear-gradient(#AABBD4, #4873A6) !important;
    -webkit-border-radius: 28;
    -moz-border-radius: 28;
    border-radius: 28px;
    text-shadow: 1px 1px 3px #666666;
    font-family: 'Lato', 'Open Sans', Arial, sans-serif;
    font-weight: 400;
    color: #ffffff;
    padding: 10px 20px 10px 20px;
    text-decoration: none;
    line-height: 95%;
}

我假设-webkit-border-radius: 28; -moz-border-radius: 28;上缺少度量单位应为px

某些类不再有效但显示在css和html中

1 个答案: