Zoinky
Zoinky

Reputation: 5019

Kendo PanelBar and nested floating divs (ASP.NET MVC)

I am trying to insert a kendo listview in each of the panels but it seems to mess up because my listview items have css float:left

I have simplified the problem to the following.. which does not show any items in the panelbar because the div has floating style

 @(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>);

    })

)

This is a very simplified version of what am trying to do which does not next a listview. Thank you

Upvotes: 0

Views: 1047

Answers (1)

Simon Taylor
Simon Taylor

Reputation: 307

(Old question, but just to help the next person searching for this).

Add this to the bottom of your Content block containing the floated divs.

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

Upvotes: 1

Related Questions