我正在尝试在Electron应用程序中使用jqtree。我已经能够使它完成我需要做的所有事情。但是,将其放置在窗口上遇到了问题。

我的index.html文件如下所示:

<body>
    <div id="container">
        <div id="authors">
            <ul id="authlist"></ul>
        </div>
        <div id="stree"></div>
        <div id="clear"></div>
    </div>
    <div id="main-area"></div>
</body>


和相关的CSS是:

#container {
    display: inline-block;
    width: 610px;
    margin: auto;
    border: 10px solid orange''
}
#authors {
    float: left;
    width: 200px;
    border-style: solid;
}
#stree {
    width: 400px;
    margin-left: 210px;
    border-style: solid;
}
#clear {
    clear: both;
}


stree是保存jqtree的div

当我填充它时,我得到以下信息:

javascript - 电子应用中的jQtree定位问题-LMLPHP

我想要的是使树的顶部元素与列表的第一个元素对齐。

我尝试在vertical-aligncontainer div上设置stree,但是还没有运气。

HTML / CSS不是我的主要专长,因此我可能在这里做一些蠢事。但我将不胜感激。

最佳答案

我尝试了以下CSS:

#container {
    width: 612px;
    margin: auto;
    border: 10px solid orange;
}
#authors {
    float: left;
    width: 200px;
    border-style: solid;
}
#stree {
    float: left;
    width: 400px;
    border-style: solid;
}
#clear {
    clear: both;
}


它似乎有效。它将树放置在authors div旁边。

09-25 19:48