Chuyển tới nội dung chính
ZZalo Platforms

Cluster

Cập nhật lần cuối:

Cluster là component để nhóm các phần tử lại với khả năng kiểm soát khoảng cách lề giữa chúng.

stack_padding_issue

Properties​

Example​

import React from "react";
import { Page, Cluster, Button } from "zmp-ui";

export default function HomePage() {
  return (
    
      <Cluster className='section-container' space='2rem'>
        <div
          style={{
            border: "solid 2px",
            width: "20px",
            height: "20px"
          }}
        />
        <div
          style={{
            border: "solid 2px",
            width: "30px",
            height: "20px"
          }}
        />
        <div
          style={{
            border: "solid 2px",
            width: "40px",
            height: "20px"
          }}
        />
        <div
          style={{
            border: "solid 2px",
            width: "50px",
            height: "20px"
          }}
        />
        <div
          style={{
            border: "solid 2px",
            width: "60px",
            height: "20px"
          }}
        />
      </Cluster>
    
  );
}