首页 > 解决方案 > 标题/部分粘贴到页面顶部

问题描述

无论我尝试什么,我都无法让我的标题部分粘在页面顶部!

.cluster-padding-large {
  padding: 30px 1.28%;
}

.flex-row {
  display: flex !important;
  /* box-sizing: border-box; */
  /* display: flex; */
  flex: 0 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}
<section class="zpa-container zp ba-25443645">
  <div class="js-cluster zpa-cluster-padding-none cluster-padding-large zp cac-25443645">
    <div class="flex-row middle-sm zpa-mobile-navigation-wrapper">
      <div class="xs-12 sm-2 zpa-navbar-order">
        <div class="zpa-voffset--xs zpa-mobile-align--center zpa-align--center zpa-image-max-width--xlarge zp ba-25443642" data-id="25443642">
          <a class="zpa-disabled-when-link-empty" href="https://123.com" target="_self" data-type="custom_dest"> <img style="max-height: 45px;" src="{{ 'bae_babeLogo.png' | asset_url }}" alt="Logo" </a></div>
      </div>
      <div class="xs-12 sm-7 zpa-mobile-row-offset-none zpa-text-center">
        <div class="zpa-navigation-main-box"><label class="zpa-navbar-label zp lat-25443643" for="nav_5722335"> <svg class="zpa-icon-currentcolor zpa-navgation-icon" width="24px" height="24px"> <use xlink:href="#navbar-icon"></use> </svg> <span class="zpa-navbar-menu-title zpa-tablet-offset-left-xs">MENU</span> </label></div>
        <input type="checkbox" name="navigation button" id="nav_5722335" class="zpa-navigation-toggle hidden">
        <div class="zpa-navigation-list__wrap zpa-navigation-list-wrap-btn zpa-mobile-offset-right-xs">
          <ul class="zpa-list-unstyled zpa-navigation-list zp ba-25443643" data-id="25443643">
            <li class="zpa-navigation-list-item"><a class="zpa-navigation-list-link zp lat-25443643" href="#5722351" target="_self" title="Reviews"> Reviews </a></li>
            <li class="zpa-navigation-list-item"><a class="zpa-navigation-list-link zp lat-25443643" href="#5722358" target="_self" title="FAQ"> FAQ </a></li>
            <li class="zpa-navigation-list-item"><a class="zpa-navigation-list-link zp lat-25443643" href="#5722356" target="_self" title="Portable Mini Air Conditioner MAX™"> 123™ </a></li>
          </ul>
        </div>
      </div>
      <div class="xs-12 sm-3 zpa-mobile-absolute-position zpa-mobile-wrap-btn-cart center-xs">
        <div class="flex-grow-1 zpa-mobile-btn-center zpa-text-center-sm zpa-button-alignment-center"><a class="zpa-btn-custom zpa-mobile-btn-size zpa-button-padding-medium zp ba-25443644" data-id="25443644" href="#5722356" data-type="cluster_dest" target="_self" role="button"> ADD TO CART </a></div>
      </div>
    </div>
  </div>
</section>

选项卡选项列表在此部分和“flex-row”中,其中包含用于对齐元素的 css,问题是,无论我尝试什么,无论是位置:粘性,在具有内联样式或任何内容的部分,或者'最佳; 0' 根本没有任何工作。我错过了一些明显的东西吗?

标签: htmlcss

解决方案


使用 position: fixed in css 使某些东西留在页面上


推荐阅读