@media 屏幕和 (min-width:1026px) 在特定页面上不起作用

Question

网页标题 "Kasse" 没有缩进到 max-with 桌面版的 1140px。这是它不起作用的页面：https://www.paastoa.com/kasse/ (You have to put one item to the cart, to see the page, so open this link first: https://www.paastoa.com/?add-to-cart=2651 然后按按钮 "Weiter zur Kasse")

这里是一个示例，它工作的页面（具有相同的 CSS）：https://www.paastoa.com/forum/intervallfasten/

这是“.site-main”-class的代码，也就是“.header”的parent class（其中 page-title 是):

@media screen and (max-width:1025px) {
    .site-main {
        max-width: 1140px!important;
        padding: 10px 30px 50px 30px!important
    }
}

@media screen and (min-width:1026px) {
    .site-main {
        max-width: 1140px!important;
        padding: 50px 0 50px 0!important
    }
}

感谢您的帮助，如果您需要更多详细信息，请随时询问。

Answer 1

我发现这个元素有内联样式，你应该从元素中删除样式。

<section class="elementor-element elementor-element-4db61fc1 elementor-section-stretched elementor-section-boxed elementor-section-height-default elementor-section-height-default elementor-section elementor-top-section" data-id="4db61fc1" data-element_type="section" data-settings="{&quot;stretch_section&quot;:&quot;section-stretched&quot;}" style="width: 1583px; left: 0px;">

这是您的 CSS

的修复方法

@media screen and (min-width: 1026px) {
    .site-main {
        max-width: 1140px!important;
        padding: 50px 0 50px 0!important;
        margin: 0 auto;
    }
}

.elementor-1137 .elementor-element.elementor-element-4db61fc1 {
    color: #000000;
    margin-top: 0px;
    margin-bottom: 0px;
    padding-bottom: 50px;
}

@media 屏幕和 (min-width:1026px) 在特定页面上不起作用

@media screen and (min-width:1026px) not working on specific page

css

wordpress

media-queries

woocommerce