sc-css-grid-system
Simple CSS grid system component built with styled component for react.
sc-css-grid-system utilizes the power of CSS grid and styled-components to easily create responsive grids.
key features
- responsive breakpoint xs,sm,md,lg,xl
- responsive gutter/gap option
- really easy to use
Responsive Grid Example:
import {Grid} from 'sc-css-grid-system';
function CssGridSystem() {
return (
<Grid xs={2} sm={3} md={4} lg={6} xl={12} gap={30}>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<div>7</div>
<div>8</div>
<div>9</div>
<div>10</div>
<div>11</div>
<div>12</div>
</Grid>
);
}
render as:
Top comments (0)