Pagecontent gets inside a created user macro

[Martze]

Hello Dear Community!

I have the Confluence Data Center version and developed a user macro that looks like the following:

<div id="doccontrolWrapper">

  <div id="doccontrol" class="doccontrol" style="cursor: pointer">

    <div id="doccontrol-header">

      <div id="doccontrol-layout-div"> </div>

      <div id="doccontrol-subtitle">Doccontrol</div>

      <div id="doccontrol-close-button">&#10006;</div>

    </div>

    <ac:structured-macro ac:name="expand" ac:schema-version="1">

      <ac:parameter ac:name="title">Doccontrol</ac:parameter>

      <ac:rich-text-body> $body </ac:rich-text-body>

    </ac:structured-macro>

    <div id="blocks" style="display: flex; gap: 10px"></div>

  </div>

</div>

<script defer>
Display + Design logic, should not be any problem
...
</script>

(Nested Macro Expand inside this Macro)

--------------------------------

Problem:

The Macro has a absolute position and renders on the top right of a page.
Now, when I use it in the edit mode, insert it like any other Makro to the page and place  anything under the macro (f. ex. a text or anything):

the content underneath the Macro gets rendered inside the DOM Element of the Macro, eventough it should not have any connection to it.


The only thing I can think of is the Line <ac:rich-text-body> $body </ac:rich-text-body>, but I tried several things out (delete it, delete only variable ....), nothing worked.

What am I doing wrong, can somebody explain?

Thank you very much!

[Martze]

The problem was an empty div (id="blocks"). This is an interesting behaviour. A simple space inside the div, which you cant even see when its rendered was the solution...