0

I'm using django template to render my hierarchical tree in a web page. In the process of rendering of a tree I see these strange whitespaces between nodes:

enter image description here

Here is my recursive template:

index.html:

<ul class="Container">
    <li class="IsRoot">
        <div class="Expand">
        </div>
        <div class="Content">
            Содержание
        </div>
    </li>
    {% include 'list.html' with data=list %}
</ul>

and list.html (as a recursive part):

<ul class="Container">
    <li class="Node ExpandClosed">
        <div class="Expand"></div>
        <div class="Content">
            <a href="/help/{{data.name}}">
                {{data.content}}
            </a>
        </div>
        {% for item in data.decendent %}
            {% include 'list.html' with data=item %}
        {% endfor %}
    </li>
</ul>

How to debug what's the matter with this template and in what period of time it happens? As you can see, I don't generate any whitespaces in this template.

Павел Иванов
  • 1,863
  • 5
  • 28
  • 51

1 Answers1

1

The white space is not the problem, and it is not causing the spaces in your rendered tree. The reason for that appears to be that you are nesting ul elements directly inside uls, which isn't strictly speaking valid: they should be inside lis.

Daniel Roseman
  • 588,541
  • 66
  • 880
  • 895
  • Unfortunately, this assumption is probably correct but in my case it doesn't solve my problem and in addition breaks the layout. In a way as I described it above, it renders this structure: http://take.ms/sj67a When I'm trying to wrap ul in list.html in li like here: http://take.ms/WqJLu it renders in a broken way: http://take.ms/sN2iT Where am I wrong? P.S. Tree was implemented like here: http://javascript.ru/ui/tree (you can look at it in the end of the document) – Павел Иванов Jul 01 '15 at 09:40