What is the use of split button?
Michael Gray
Updated on March 30, 2026
Summary: A split button is a dual-function menu button that offers a default action as well as the possibility of choosing a different action by selecting from a set of alternatives.
What is a split button?
The Split Button is a composite control with which the user can select a default value bound to a primary button, or select from a list of mutually exclusive values displayed in a drop-down list bound to a secondary button. Introduction. Split Button Properties.
How do you make a split button?
Use any element to open the dropdown menu, e.g. a , or
element. Use a container element (like ) to create the dropdown menu and add the dropdown links inside it. Wrap a element around the button and the to position the dropdown menu correctly with CSS.
What are UI buttons?
UI Buttons are one of the best UI material that instinctively attract and convert visitors to buyers. Different types of UI Buttons that you can use; CTA button, Text button, Ghost button, Dropdown button, Floating Action Button (FAB), Hamburger button, Plus button, Expendable button, Share button, Raised buttons.
How do I make a dropdown button in CSS?
Example Explained HTML) Use any element to open the dropdown content, e.g. a , or a element. Use a container element (like ) to create the dropdown content and add whatever you want inside of it. Wrap a element around the elements to position the dropdown content correctly with CSS.
How do I make a button down in HTML?
You can use two values top and left along with the position property to move an HTML element anywhere in the HTML document.
- Move Left – Use a negative value for left.
- Move Right – Use a positive value for left.
- Move Up – Use a negative value for top.
- Move Down – Use a positive value for top.
Where do you put UI buttons?
Placement
- In small windows, the primary action button should be placed at the bottom right. Our brains always scan the content on the screen in front of us, before we even realize it.
- Full page designs should have the primary button on the left side of the page.
How big should a UI button be?
The highest accuracy was found with buttons between 42-72 pixels. This means that 42 pixels is the minimum and 72 pixels is the maximum button size that’s most optimal for users. The most preferred button size was 60 pixels, which is about the middle of the range.
How do I move a button to the right CSS?
If you want to move the button to the right, you can also place the button within a element and add the text-align property with its “right” value to the “align-right” class of the .
What are the types of buttons in HTML?
There are three types of buttons:
- submit — Submits the current form data. (This is default.)
- reset — Resets data in the current form.
- button — Just a button. Its effects must be controlled by something else (that is, with JavaScript).
Should buttons be on the left or right?
There’s actually a pretty easy answer: if you wear women’s clothing, the buttons are on the left side of the shirt. However, if you wear men’s shirts, the buttons line up on the right side.
How do I use the splitbutton?
When clicked for the first time, the SplitButton will expand a hidden dropdown with a list of the available options. If an item in the dropdown is pressed, the split button header will be updated with the selected command name, and it will be executed.
What is a persistent split button?
A useful variation of split buttons is called a persistent split button (sometimes known as a modal split button ). In this type of button, the default changes to the last action selected by the user (from the list of actions in the split-button menu).
What is splitbutton component in angular?
The SplitButton component allows the user to execute a default action which is bound to a Button or to choose a predefined action from a drop-down list. The SplitButton Component is part of Kendo UI for Angular, a professional grade UI library with 100+ components for building modern and feature-rich applications.
What is the difference between menu and Split buttons?
Unlike regular menu buttons, in which the text label should clearly describe a generic category comprising all that is contained in the menu, a split button’s visible text label should be a descriptive name of the default tool or command.
