Telerik TabStrip integrated with bootstrap column size

[章民]

I have a ASP.NET webform project and want to add bootstrap. But I meet a problem for the RadTabStrip's RadTab with col-xs-6(bootstrap). The RadTabStrip's RadTabs are dynamically created by code. I also set the "col-xs-6 btn btn-primary" to RadTab's attriibute of "class".  I wish I can see two columns RadTab per row in the size of xs(col-xs-6). But I still failed in the RadTab's color and arrange. Does somebody know how to solve this problem？

 

<telerik:RadTabStrip RenderMode="Lightweight" runat="server" ID="RadTabStripMenu" MultiPageID="RadMultiPageMenu" SelectedIndex="0" OnTabClick="RadTabStripMenu_TabClick">

 

for (int index = 0; index < dt.Rows.Count; index++)
{
    string intOrderNo = dt.Rows[index]["intOrderNo"].ToString().Trim();
    string chMenuItem = dt.Rows[index]["chMenuItem"].ToString().Trim();
    string chDescritp = dt.Rows[index]["chMenuName"].ToString().Trim();

    short tabIndex = Convert.ToInt16(chMenuItem.Substring(2, 3));

    RadTab radTabItem = new RadTab();
    radTabItem.Text = chDescritp;
    radTabItem.Value = tabIndex.ToString();
    radTabItem.PageViewID = "RadPageViewMenu" + tabIndex.ToString();
    radTabItem.Font.Size = new FontUnit(FontSize.Large);
    radTabItem.CssClass = "TabItem";
    radTabItem.Attributes.Add("class", "col-xs-6 btn btn-primary");

    RadTabStripMenu.Tabs.Add(radTabItem);
    RadTabStripMenu.DataBind();//add 20170504
}