• Components
    • Barcodes
    • Buttons
    • Charts
    • Conversational UI
    • Data Query
    • Date Inputs
    • Date Math
    • Dialogsupdated
    • Drawing
    • Dropdowns
    • Editorupdated
    • Excel Export
    • File Saver
    • Filter
    • Ganttupdated
    • Gauges
    • Gridupdated
    • Iconsupdated
    • Indicators
    • Inputs
    • Labels
    • Layoutupdated
    • ListBox
    • ListView
    • Mapbeta
    • Menus
    • Navigationupdated
    • Notification
    • Pagerupdated
    • PDF Export
    • PivotGridupdated
    • Popup
    • ProgressBars
    • Ripple
    • Schedulerupdated
    • ScrollView
    • Sortable
    • ToolBarupdated
    • 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

Angular Grid Sizing

The Grid provides predefined options which allow you to set different padding to the Grid building blocks (tables, buttons, inputs, dropdowns, and others).

To change the default padding of the Grid elements, set the size property of the component. It accepts values of type GridSize.

The size option supports the following values:

  • small—Reduces the default padding of the building blocks of the Grid. Especially useful when you want to show more records on the page.
  • medium (default)—Represents the default padding of the building blocks of the Grid.
  • none—Removes the styling related to the Grid sizing option.

The size option does not change the padding of the elements displayed inside a popup (such as Filter Menu, Column Menu).

The following example demonstrates how to define the Grid size.

Example
View Source
Change Theme:

In this article

Not finding the help you need?