• Getting Started
  • Components
    • Barcodes
    • Buttons
    • Chartsupdated
    • Conversational UIupdated
    • Data Query
    • Date Inputsupdated
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Filter
    • Gantt
    • Gauges
    • Gridupdated
    • Icons
    • Indicators
    • Inputsupdated
    • Labels
    • Layout
    • ListBox
    • ListView
    • Map
    • Menus
    • Navigation
    • Notification
    • Pager
    • PDF Export
    • PDFViewer
    • PivotGridupdated
    • Popup
    • ProgressBars
    • Ripple
    • Schedulerupdated
    • ScrollView
    • Sortable
    • Spreadsheetupdated
    • ToolBar
    • Tooltips
    • TreeList
    • TreeView
    • Typography
    • Uploads
    • Utilities
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Sample Applications
  • FAQ
  • Troubleshooting
  • Updates
  • Changelogs
New to Kendo UI for Angular? Start a free 30-day trial

AppBarSpacerComponent

Represents the Kendo UI AppBarSpacer component for Angular. Used to give additional white space between the AppBar sections and provides a way for customizing its width.

 * @Component({
   selector: 'my-app',
   template: `
       <kendo-appbar>
           <kendo-appbar-section>
                <button kendoButton fillMode="flat">
                    <kendo-icon name="menu"></kendo-icon>
                </button>
           </kendo-appbar-section>

           <kendo-appbar-spacer></kendo-appbar-spacer>

           <kendo-appbar-section>
               <h2>Page Title</h2>
           </kendo-appbar-section>
       </kendo-appbar>
   `
})
class AppComponent {}

Selector

kendo-appbar-spacer

Inputs

NameTypeDefaultDescription

width

string

Specifies the width of the AppBarSpacer.

If not set, the AppBarSpacer will take all the available space.

In this article

Not finding the help you need?