Kendo PanelBar 和嵌套浮动 div (ASP.NET MVC)答案

【问题标题】：Kendo PanelBar and nested floating divs (ASP.NET MVC)Kendo PanelBar 和嵌套浮动 div (ASP.NET MVC)
【发布时间】：2014-11-09 03:06:46
【问题描述】：

我试图在每个面板中插入一个剑道列表视图，但它似乎搞砸了，因为我的列表视图项目有 css float:left

我已将问题简化为以下内容.. 由于 div 具有浮动样式，因此在面板栏中未显示任何项目

 @(Html.Kendo().PanelBar()
    .Name("panelbar")
    .ExpandMode(PanelBarExpandMode.Multiple)

    .Items(panelbar =>
    {
        panelbar.Add().Text("Images")
            .Expanded(true)

            .Content(@<text>
                <div style="float:left;">one</div>
                <div style="float:left;">two</div>

            </text>);
        panelbar.Add().Text("Movies")
                   .Expanded(true)
                   .Content(@<div>movies</div>);
        panelbar.Add().Text("Images")
                    .Expanded(true)
                    .Content(@<div>flash</div>);

    })

)

这是一个非常简化的版本，它不下一个列表视图。谢谢

【问题讨论】：

您是在谈论您定义的 2 个 div 向左浮动还是容器？
示例中的 2 个 div 表现出与嵌套列表视图时相同的问题，所以我认为这是因为列表视图的项目正在生成左浮动 div。所以我尝试了一个像上面这样的简单示例，并出现了同样的问题。
你能发布一个 jsfiddle 或其他东西来显示发生了什么吗？

标签： kendo-ui kendo-asp.net-mvc kendo-listview kendo-panelbar

【解决方案1】：

（老问题，但只是为了帮助下一个搜索此问题的人）。

将此添加到包含浮动 div 的内容块的底部。

<div style="clear: both;"></div>

【讨论】：