twig html.html.twig DIV before Body Section

By davebeach on 15 May 2017 at 05:43 UTC

Templating using Foundation 6 sub-theme

html.html.twig

I am noticing some unexpected behavior where DIV sections are appear between head and body sections.

<head>
....
</head>
<div class="gr-top-z-index gr-top-zero" tabindex="-1">
        <div data-reactroot="" class="_970ef1-hoverMenu">
                <div class="_970ef1-panel">
                        <div class="_970ef1-tooltip _970ef1-tooltip_hidden undefined">
                        </div>
                        <div class="_970ef1-buttonArea">
                                <div class="_970ef1-btn _970ef1-btn_disable" tabindex="-1">
                                </div>
                        </div>
                        <div class="_970ef1-line">
                        
                        </div>
                        <div class="_970ef1-buttonArea">
                                <div class="_970ef1-btn _970ef1-btn_grammarly" data-action="editor" tabindex="-1">
                                </div>
                        </div>
                </div>
        </div>
</div>
<div style="visibility: hidden; top: -9999px; position: absolute; opacity: 0;">
        <div data-reactroot="" class="_970ef1-hoverMenu">
                <div class="_970ef1-panel">
                        <div class="_970ef1-tooltip _970ef1-tooltip_hidden undefined"></div>
                        <div class="_970ef1-buttonArea">
                                <div class="_970ef1-btn _970ef1-btn_disable" tabindex="-1"></div>
                        </div>
                        <div class="_970ef1-line">
                                
                        </div>
                        <div class="_970ef1-buttonArea">
                                <div class="_970ef1-btn _970ef1-btn_grammarly" data-action="editor" tabindex="-1">
                                        
                                </div>
                        </div>
                </div>
        </div>
</div>

<body class="lang-en user-logged-in path-frontpage node--type-landing-page toolbar-fixed toolbar-horizontal" data-gr-c-s-loaded="true" style="padding-top: 39px;">
...
</body>

The template is as follows

{%
set body_classes = [
logged_in ? 'user-logged-in',
not root_path ? 'path-frontpage' : 'path-' ~ root_path|clean_class,
node_type ? 'node--type-' ~ node_type|clean_class,
db_offline ? 'db-offline',
]
%}
<!DOCTYPE html>
<html {{ html_attributes|raw }}>
  <head>
    <head-placeholder token="{{ placeholder_token|raw }}">
    <title>{{ head_title|safe_join(' | ') }}</title>
    <meta name="description" content="Pro-PPM Solutions is a technology media company, educating enterprises to think outside the box and embrace next generation technology.">
    <link type="text/plain" rel="author" href="/humans.txt">

    <css-placeholder token="{{ placeholder_token|raw }}">
    <js-placeholder token="{{ placeholder_token|raw }}">
  </head>
  <body{{ attributes.addClass(body_classes) }}>
  <a href="#main-content" class="visually-hidden focusable skip-link">
    {{ 'Skip to main content'|t }}
  </a>
  {{ page_top }}
  {{ page }}
  {{ page_bottom }}
  <js-bottom-placeholder token="{{ placeholder_token|raw }}">
  </body>
</html>

Is this correct? What is causing the div sections to appear before the body?>