CSS:left:auto不会覆盖left:0:

史蒂夫

我正在使用left: auto;,希望left: 0;它能被覆盖,但是它不起作用(请参阅jsfiddle)-我想<header class="h1...">居中对齐。

HTML:

<div class="root">
  <header class="h1 header-opacity-enabled sticky-enabled sticky-no-topbar menu-animation-enabled hover-delay-enabled sticky-collapse sticky-opacity-enabled with-search-box with-cart-box lr-mi-with-widget-visible sticky" data-sticky-trigger-position="400" data-menu-slidedown-duration="400" data-menu-slideup-duration="500" data-menu-fadein-duration="300" data-menu-fadeout-duration="400" style="top: 0px;">
    <section class="main-header">
      <div>
        <div itemtype="http://schema.org/Organization" itemscope="itemscope" class="title">
          <div class="logo-wrapper"> <a class="logo" href="https://websitetechnology.dev/" itemprop="url"> <img alt="Doig Website Technology" src="https://websitetechnology.dev/wp-content/uploads/2016/04/logo3-blue.png" itemprop="logo" height="77"> </a>
            <h3>Website Engineering, Optimisation &amp; Advertising</h3>
          </div>
        </div>
      </div>
      <div class="shopping-bag">
        <div class="widget woocommerce widget_shopping_cart">
          <div class="widget_shopping_cart_content">
            <div class="wrap">
              <p class="empty-item">There are no items in your cart.</p>

              <!-- end product list --> 

            </div>
          </div>
        </div>
      </div>
    </section>
    <div class="s-801"></div>
    <div class="s-981"></div>
  </header>
</div>

CSS:

.h1.sticky.sticky-opacity-enabled .main-header {
    background-color: #FFFF00;
}
@media screen and (min-width: 801px) {
.root header.sticky-enabled.sticky {
    margin: 0 auto;
    width: 1236px;
    padding: 0;
    max-width: calc(1070px + 10%);
}
.root header.sticky {
    position: fixed;
    top: auto;
    left: auto;
    width: 100%;
}
}

现场直播在这里向下滚动页面一半,直到<header>从窗口顶部向下弹出即时贴

left: auto;正在应用,但是<header>' is stuck to the left side of the screen. This`必须居中对齐。

你能帮忙吗?

用户2748042

我已尝试解决您的问题,并请附上屏幕截图。屏幕截图将帮助您解决问题。

谢谢,在此处输入图片说明

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

TOP 榜单

热门标签

归档