2 Column Layout of Template

[Jim]

Is it possible to layout a template to display my data in 2 columns?

 

I am using a Kendo window with a Kendo template (similar to the online examples)

 

No matter what I try I am getting the 2 columns to stack on top of each other.

 Example:

  I am message

  I am message response

Where I want to see

I am message     I am message response

 

 Currently I have the following:

    @(Html.Kendo().Window().Name("MessageModal").Title("View Message").Visible(false).Modal(true).Draggable(true).Width(1200).Resizable()
        .Content(@<text>
        <script type="text/x-kendo-template" id="messageTemplate">
    <div class="container-fluid">
        <div class="row">
            <div id="details-container" class="col-sm-6" style="background-color:lavender;">
                    <div><strong>A Message</strong> </div>*@
                <div id="myMessage"></div>
            </div>
            <div id="details-container" class="col-sm-3" style="background-color:lavenderblush;">
                <div> <strong>A Response Message</strong></div>
                <div id="myMessageResponse"></div>
            </div>
        </div>
    </div>
</script>

[Alexander Popov]

Hi Jim,

You would need some CSS rules to take care of the containers' positioning. I would suggest checking if the Bootstrap CSS and JavaScript files are properly included in the page, as I noticed that Bootstrap classes are already present in the template's content.

Regards,
Alexander Popov
Telerik