Desktop and tablet mode showing up at the same time

Hello,

1st bug:

I have added an HTML section to the header bottom with the integrated customizer but when I resize the navigator to see tablet mode it is loading the code in double. The navigator keep showing the HTML section for desktop and add the same section for tablet under the desktop one. I have this bug on firefox, firefox developer edition, and chromium.

2nd bug:

In this HTML section, I have a nav block with three links. I applied a display:inline-block on the links in order to create a horizontal menu. It is not working in the desktop section but it works in the tablet section that shows up in double when I resize the navigator. I don’t achieve to figure out which environment variable is preventing the display:inline-block to work.

I also tried with display:flex or inline-flex and flex-direction:row on the container of the links but it doesn’t work too.

Any ideas would be greatly appreciated, unfortunately I still don’t have a staging site to provide a link but there is nothing particular in my html/css code to create a such bug.

Here is the structure of the code from the navigator:

<header id="masthead" class="site-header header-v2">
::before
<div id="masthead-inner" class="site-header-inner">

/* THE TWO FIRST SECTIONS OF THE HEADER */
<div id="cb-row--header-top" class="header-top header--row layout-full-contained" data-row-id="top" data-show-on="desktop mobile"></div>
<div id="cb-row--header-main" class="header-main header--row layout-full-contained" data-row-id="main" data-show-on="desktop mobile"></div>

/* HEADER BOTTOM SECTION WHERE MY CODE IS INCLUDED; APERTURE OF THE DIV ROMANIAN MARCH */
<div id="cb-row--header-bottom" class="header-bottom header--row layout-fullwidth" data-row-id="bottom" data-show-on="desktop">
<div class="header--row-inner header-bottom-inner light-mode">
<div class="customify-container" /* display flex */>
::before
<div class="customify-grid  cb-row--desktop hide-on-mobile hide-on-tablet customify-grid-middle">
<div class="row-v2 row-v2-bottom no-left no-center" /* display:flex */>
<div class="col-v2 col-v2-right">
<div class="item--inner builder-item--html" data-section="header_html" data-item-id="html">
<div class="builder-header-html-item item--html">

/* MY CODE IN THE HTML SECTION */
<div id="left-block-img"><figure><img></figure></div>

<div id="right-block-text">
<h2>Lorem Ipsum</h2>
<p>Lorem ipsum three times</p>
<nav id="troisboutons">
<a href="">Acheter</a>
<a href="">Louer</a>
<a href="">Expertiser</a>
</nav>
</div>
/* END OF MY CODE */

/* CLOSING OF THE DIV ROMANIAN MARCH */
</div>
</div>
</div>
</div>
</div>
::after
</div>
</div>
</div>
</div>
::after
</header>

• This topic was modified 4 years, 4 months ago by cyberdome.
• This topic was modified 4 years, 4 months ago by cyberdome.
• This topic was modified 4 years, 4 months ago by cyberdome.