Want to add a button inline with the kendo tab

[Sonali]

I have created a kendo tabstrip with 2 tabs. I want to add buttons inline with the tabs and to their extreme right. I have attached a screenshot of the functionality I want to achieve.

I tried using the css display:flex property, but the buttons are still not in line with the tabs.

[Ivan Danchev]

Hello Sonali,

The TabStrip does not support custom buttons, so a possible approach to add such would be appending them with jQuery: https://dojo.telerik.com/iZEZIZUX

Note that modifying the Html structure of the widgets like this is not recommended. The TabStrip hasn't been tested in such scenarios, so it could lead to potential glitches and/or unexpected behavior in certain cases.

Regards,
Ivan Danchev
Progress Telerik

[Sonali]

Hi Ivan

The method which you are using is actually appending the buttons to the k-tabstrip-items. I don't want this. I just want to show those buttons in the same line where the tab name appears, and even if I collapse the tabs, these buttons should not shift towards the side of the tab name.

I was thinking if we can reduce the size of just the tab name container, then there won't be any conflict in creating any buttons there in the same line.

[Ivan Danchev]

Hi Sonali,

If you don't want to append the buttons to the TabStrip, consider wrapping the TabStrip in a container (a div element) and positioning the buttons within that div through CSS so that they are displayed over the TabStrip. This way they would appear over the TabStrip, without being part of its Html structure.

Regards,
Ivan Danchev
Progress Telerik