[Solved] Style like Toolbar Button Group

[Ruairi]

I have a Button control (State) and a DropDownList control (Inspection Building Control: Create) - see attached image.
I want then to be beside each other and styled like a ButtonGroup in the ToolBar also shown in the image.

What I currently have is almost there but you can see that the left side of the DropDownList control isnt flat - it still has the rounded edges.
I need the DropDownList to be styled like "k-button-group k-group-end" any ideas how to do it?

Alternatively and even better would be if I could just add a DropDownList control into a TooBars ButtonGroup (which only seems to accept buttons)

@model IStateful
@{
    //Output controls to add to ToolBar
    string ddlStates =
            "<div class='k-button-group'>" +
            Html.Kendo().Button()
                .Name("lblCurrentState")
                .HtmlAttributes(new { type = "button", @class = "k-group-start ignoreChange" })
                .ImageUrl(Url.Content("~/Images/16px/gears_run.png"))
                .Content("State")
                .Enable(true)
                .ToHtmlString()
            +
            Html.Kendo().DropDownList()
            .Events(e =>
            {
                e.Change("workflowTransitionState");
            })
            .Name("workflowTransitions")
            .DataTextField("Text")
            .DataValueField("Value")
            .BindTo((SelectList)ViewBag.Transtions)
            .HtmlAttributes(new {id="workflowTransitions",@class = "k-group-end", @style = "width:300px;margin-left:0px"})
            .ToHtmlString()
            +
            "</div>";
}
<div id="workflowToolbar">
@(Html.Kendo().ToolBar()
  .Name("tbWorkflow")
    .Items(items =>
    {
        items.Add().Template(@ddlStates).Overflow(ShowInOverflowPopup.Never);
        items.Add().Type(CommandType.ButtonGroup).Buttons(buttons =>
        {
                buttons.Add().Text("Bold").Togglable(true).SpriteCssClass("k-tool-icon k-bold").ShowText(ShowIn.Overflow);
                buttons.Add().Text("Italic").Togglable(true).SpriteCssClass("k-tool-icon k-italic").ShowText(ShowIn.Overflow);
                buttons.Add().Text("Underline").Togglable(true).SpriteCssClass("k-tool-icon k-underline").ShowText(ShowIn.Overflow);
        });
    })
)

[Alexander Valchev]

Hello Tyler,

You are correct, the buttonGroup component accepts only buttons.
The easiest way to remove the left corners border radius is to override the corresponding CSS styles. Please use the web developer tools of your browser to examine the rendered HTML and find the exact element and CSS rule that you have to override. That should be a span.k-widget.k-dropdown.k-header element. By default it has border-radius: 4px; you should change it to border-radius: 0 4px 4px 0;

I hope this information will help.

Regards,
Alexander Valchev
Telerik