# Toolbar and Button Layout Behavior Get started with Menus and Toolbars for WinForms. Create versatile menus and docking/floating toolbars. See more in documentation here. ## Content [C1ToolBar](/componentone/docs/win/online-menus-toolbar/)s layout is very flexible. They can be horizontal or vertical as well as docked to specific areas of the form. The toolbar's [Movable](/componentone/docs/win/online-menus-toolbar/) property is enabled by default. This allows the user to move the toolbar anywhere on the form. The default layout for a toolbar is horizontal. You can change the toolbar layout to vertical by setting the [Horizontal](/componentone/docs/win/online-menus-toolbar/) to **False**. > type=note > **Note**: When you set the [ToolBarStyle](/componentone/docs/win/online-menus-toolbar/) property to DropDownMenu, the menu behaves like a drop-down so the toolbar becomes stationary. In addition to toolbar orientation, [C1ToolBar](/componentone/docs/win/online-menus-toolbar/) also provides button alignment for vertical toolbars. You can align the image or text near, center, or far from the button through the [ButtonAlign](/componentone/docs/win/online-menus-toolbar/) property. The following table shows the values for the [ButtonAlign](/componentone/docs/win/online-menus-toolbar/) property: | Property Setting | Image | | --- | --- | | **ButtonAlign.Near** | ![Near button alignment](https://cdn.mescius.io/document-site-files/images/a27cb622-e6d9-4efc-a0b0-0c31245fd632/imagesext/image11_163.png) | | **ButtonAlign.Center** | ![Centre button alignment](https://cdn.mescius.io/document-site-files/images/a27cb622-e6d9-4efc-a0b0-0c31245fd632/imagesext/image11_164.png) | | **ButtonAlign.Far** | ![Far button alignment](https://cdn.mescius.io/document-site-files/images/a27cb622-e6d9-4efc-a0b0-0c31245fd632/imagesext/image11_165.png) | You can determine the relative position of text and images for toolbar buttons in horizontal and vertical toolbars using the [ButtonLayoutHorz](/componentone/docs/win/online-menus-toolbar/) and [ButtonLayoutVert](/componentone/docs/win/online-menus-toolbar/) properties. The [ButtonLayoutHorz](/componentone/docs/win/online-menus-toolbar/) property gets the layout of the buttons when the toolbar is horizontal. This is the default orientation of the toolbar. The [ButtonLayoutVert](/componentone/docs/win/online-menus-toolbar/) property gets the layout of the buttons when the toolbar is vertical. Setting the [Horizontal](/componentone/docs/win/online-menus-toolbar/) property to **False** gets the vertical orientation for the toolbar. > type=note > **Note**: The default value for the [ButtonLayoutHorz](/componentone/docs/win/online-menus-toolbar/) property is TextOnRight. [C1ToolBar](/componentone/docs/win/online-menus-toolbar/) provides several options for customizing the toolbar buttons for vertical and horizontal toolbars. | Property Setting | Image | | --- | --- | | **ButtonLayoutHorz.TextOnRight (default)** | ![Text on Right](https://cdn.mescius.io/document-site-files/images/a27cb622-e6d9-4efc-a0b0-0c31245fd632/imagesext/image11_166.png) | | **ButtonLayoutHorz.TextOnLeft** | ![Text on Left](https://cdn.mescius.io/document-site-files/images/a27cb622-e6d9-4efc-a0b0-0c31245fd632/imagesext/image11_167.png) | | **ButtonLayoutHorz.TextAbove** | ![Text above](https://cdn.mescius.io/document-site-files/images/a27cb622-e6d9-4efc-a0b0-0c31245fd632/imagesext/image11_168.png) | | **ButtonLayoutHorz.TextBelow** | **![Text below](https://cdn.mescius.io/document-site-files/images/a27cb622-e6d9-4efc-a0b0-0c31245fd632/imagesext/image11_169.png)** | In addition to controlling the relative position of text and images for toolbar buttons you can also set the [ButtonLookHorz](/componentone/docs/win/online-menus-toolbar/) property to display text, images, or both for the horizontal toolbar and the [ButtonLookVert](/componentone/docs/win/online-menus-toolbar/) property to display text, images, or both for the vertical toolbar. > type=note > **Note**: The Text, Image, and TextAndImage values for the [ButtonLook](/componentone/docs/win/online-menus-toolbar/) property overrides the values for the [ButtonLookHorz](/componentone/docs/win/online-menus-toolbar/) and [ButtonLookVert](/componentone/docs/win/online-menus-toolbar/) properties. The [ButtonLook](/componentone/docs/win/online-menus-toolbar/) property should be set to default if you plan on setting values for the [ButtonLookHorz](/componentone/docs/win/online-menus-toolbar/) or [ButtonLookVert](/componentone/docs/win/online-menus-toolbar/) property. The following table shows the values for the [ButtonLayoutVert](/componentone/docs/win/online-menus-toolbar/) property: | Property Setting | Image | | --- | --- | | **ButtonLayoutVert.TextOnRight** | ![Right button layout](https://cdn.mescius.io/document-site-files/images/a27cb622-e6d9-4efc-a0b0-0c31245fd632/imagesext/image11_170.png) | | **ButtonLayoutVert.TextOnLeft** | ![Left button layout](https://cdn.mescius.io/document-site-files/images/a27cb622-e6d9-4efc-a0b0-0c31245fd632/imagesext/image11_171.png) | | **ButtonLayoutVert.TextAbove** | ![Above button layout](https://cdn.mescius.io/document-site-files/images/a27cb622-e6d9-4efc-a0b0-0c31245fd632/imagesext/image11_172.png) | | **ButtonLayoutVert.TextBelow (default)** | **![below above layout](https://cdn.mescius.io/document-site-files/images/a27cb622-e6d9-4efc-a0b0-0c31245fd632/imagesext/image11_173.png)** | ## See Also [DockingTab Overview](/componentone/docs/win/online-menus-toolbar/dockingtaboverview)