Masonry
Masonry layout
Ví dụ
import { Masonry } from '@xobuilder/ui';
const Demo = () => {
return (
<Masonry
columns={{
xs: 2,
sm: 3,
md: 4,
lg: 5,
}}
>
{data.map(img => {
return <img key={img} src={img} alt="" />;
})}
</Masonry>
)
};
Props
Name | Type | Default | Description |
---|---|---|---|
columns | Columns | - | Number of columns in different screen size |
gap | number | 20 | Gap between columns |