# Card Body

## Description:

Card Body

Card body holds the main content of the panel. It will take the height of the children components.![](https://github.com/CloudIO-IDC/Docs-Platform3.0/tree/5c198f04e28051e8ca03900e5ee321a86dc40a91/ui-components/widgets/io.Card.png)

### Allowed Parent Components:

1. Card Wrapper

### Allowed Child Components:

1. Action Button
2. Aggregate Card
3. Badge
4. Barcode Scanner
5. Bing Map
6. Bing Map Navigator
7. Button
8. Button Dropdown
9. Button Group
10. Calendar
11. Calendar Heatmap
12. Card Table
13. Change Role
14. Chart
15. Collaboration
16. Combination Chart
17. DIV
18. Data Model Designer
19. DataList
20. Date
21. EmbedPage
22. Form
23. Form Search
24. Fusion Chart
25. Gantt Chart
26. Gauges
27. Google Map
28. Google Navigator
29. Grid
30. Grid Layout
31. H1
32. H2
33. H3
34. H4
35. H5
36. HTML
37. Heat Map Chart
38. Horizontal Layout
39. IFrame
40. IOT Canvas
41. IOT Device Drag Source
42. Icon Menu
43. Image
44. Image Cropper
45. Kanban Board
46. Monaco Editor
47. Multi Level Pie Chart
48. Multi Series Chart
49. Node Graph
50. Number
51. OCR Component
52. Organization Chart
53. Page Fragment
54. Pagination
55. Paragraph
56. PivotGrid
57. Popover
58. Pulse
59. Rich Text Editor
60. Row
61. Simple Alert
62. Slider
63. Smart Search
64. Switch
65. Tab Panel
66. Table
67. Timeline
68. Trigger Before Render
69. UIView
70. Vertical Layout Panel
71. Video Recorder
72. Workflow Viewer
73. XY Chart
74. ZoomLine Chart

### Properties

### ➤ Functional Component

Allowed Values: Controller Function

### ➤ No Scrollbar

Allowed Values: Yes/No

### ➤ Margin

Select a value to add margin on all four sides of the component. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.

Allowed Values: Any number value

### ➤ Margin Bottom

Select a value to add margin on the bottom of the component.

Allowed Values: Any number value

### ➤ Margin Left

Select a value to add margin on the left of the component.

Allowed Values: Any number value

### ➤ Margin Right

Select a value to add margin on the right of the component.

Allowed Values: Any number value

### ➤ Margin Top

Select a value to add margin on the top of the component.

Allowed Values: Any number value

### ➤ Padding

Select a value to add padding on all four sides of the component. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.

Allowed Values: Any number value

### ➤ Padding Bottom

Select a value to add padding in the bottom of the component.

Allowed Values: Any number value

### ➤ Padding Left

Select a value to add padding in the left of the component.

Allowed Values: Any number value

### ➤ Padding Right

Select a value to add padding in right of the component.

Allowed Values: Any number value

### ➤ Padding Top

Select a value to add padding in top of the component.

Allowed Values: Any number value
