Sticky Header - обходной путь переполнения? - PullRequest
0 голосов
/ 27 марта 2020

давний скрытник и первый постер здесь:

Я искал, чтобы добавить второй липкий элемент на сайт клиента на одной странице и обнаружил, что не могу редактировать некоторые родительские И предки класс и идентификаторы на просто этого раздела, не затрагивая всю страницу.

Основная навигация сайта является липкой и имеет высоту 100 пикселей. Я пытался заставить элемент табуляции придерживаться 100px на одной странице, но все, что я пытался, сработало. Вот моя текущая попытка:

#daddy {
  position: sticky;
  position: -webkit-sticky;
  top: 100px;
  padding: 25px;
  justify-content: center;
  align-items: center;
}

А затем код в соответствующей области страницы:

<div id="cmsmasters_row_5e7e3d6bca427" class="cmsmasters_row cmsmasters_color_scheme_default cmsmasters_row_top_default cmsmasters_row_bot_default cmsmasters_row_boxed">
<div id="daddy" class="cmsmasters_row_outer_parent">
<div class="cmsmasters_row_outer">
<div class="cmsmasters_row_inner">
<div class="cmsmasters_row_margin">
<div class="cmsmasters_column one_first">
<div class="cmsmasters_tabs tabs_mode_tab">
<ul class="cmsmasters_tabs_list">
<li id="cmsmasters_tabs_list_item_5e7e3d6bcfa2a" class="cmsmasters_tabs_list_item current_tab">
<a href="#">
<span>EVERYDAY SPECIALS</span>
</a>
</li><li id="cmsmasters_tabs_list_item_5e7e3d6bd01e2" class="cmsmasters_tabs_list_item">
<a href="#">
<span>NY-STYLE PIZZA</span>
</a>

и т. Д. И т. Д. - с интервалами для каждого типа меню до </div>s, вы понимаете ... но, как вы можете видеть, div, который я дал id "папа", все еще является потомком

<div 
   id="cmsmasters_row_5e7e3d6bca427" 
   class="cmsmasters_row 
            cmsmasters_color_scheme_default 
            cmsmasters_row_top_default 
            cmsmasters_row_bot_default 
            cmsmasters_row_boxed"
>

Эти строки cmsmasters определены по всей весь сайт, поэтому изменение css повлияет на все, и это меню существует только на одной странице. Я искал стили темы, и ни один из родительских классов или идентификаторов не содержал overflow:hidden. ОДНАКО .... класс cmsmasters_tabs, расположенный ниже в div, имеет переполнение: скрыто, и в общем случае в разделе "тело" есть свойство overflow-x: hidden.

Я пытался изменить верхняя позиция для #daddy и других свойств, но ничего не работает. Я что-то здесь упускаю?

Я не могу предоставить полный сайт, потому что это промежуточный сайт, для просмотра которого требуются учетные данные. Тем не менее, я прилагаю ссылку для просмотра небольшого видео экрана рассматриваемой страницы, чтобы вы могли видеть вкладки и верхнюю навигационную панель, о которой я говорю: https://share.getcloudapp.com/4gumv45g?method=GET

Кости этого сайта изначально были созданы другим дизайнером с платной темой от CMS Masters, и им управляет собственный конструктор страниц, который очень похож на Visual Composer. Это дает мне некоторую гибкость, но это главное, что я не смог настроить по своему вкусу.

Merci !!

...