代码之家  ›  专栏  ›  技术社区  ›  Nick Gotch

如何在HTML引导树视图内联中正确布局列?

  •  0
  • Nick Gotch  · 技术社区  · 6 年前

    我正在使用 Bootstrap Treeview library 在页面上显示一些层次数据。我试图将树的每个节点分解成几列,但似乎无法让元素正确地完成这项工作。

    如果我尝试使用 span 元素在 text 树的属性如下:

    <span style="background-color: yellow; width: 50%;">foo</span><span style="background-color: red; width: 50%">foo</span>
    

    我得到这个输出:

    span tag results

    如果我尝试使用 div 元素在 文本 树的属性如下:

    <div style="background-color: yellow; width: 50%;">foo</div><div style="background-color: red; width: 50%">foo</div>
    

    我得到这样的输出:

    div tag results

    我尝试过各种组合,结果都很相似。我该怎么做才能使所有列都显示在一行上?

    1 回复  |  直到 6 年前
        1
  •  1
  •   Keerthi    6 年前

    DIV是块元素,而SPAN不是。尝试在DIV上使用内联块样式,并给它一些宽度。

    div {
        display: inline-block;
        width: 50px;
    }