xxxxxxxxxx
import 'bootstrap/dist/css/bootstrap.min.css';
import Stack from 'react-bootstrap/Stack';
function App() {
return (
<Stack gap={3}>
<div className="bg-light border">First item</div>
<div className="bg-light border">Second item</div>
<div className="bg-light border">Third item</div>
</Stack>
);
}
export default App;
xxxxxxxxxx
// === Vertical ===
<Stack direction="horizontal" gap={3}>
<div className="bg-light border">First item</div>
<div className="bg-light border">Second item</div>
<div className="bg-light border">Third item</div>
</Stack>
// === Horizontal ===
<Stack direction="horizontal" gap={3}>
<div className="bg-light border">First item</div>
<div className="bg-light border">Second item</div>
<div className="bg-light border">Third item</div>
</Stack>
xxxxxxxxxx
import 'bootstrap/dist/css/bootstrap.min.css';
import Stack from 'react-bootstrap/Stack';
function App() {
return (
<Stack direction="horizontal" gap={3}>
<div className="bg-light border">First item</div>
<div className="bg-light border">Second item</div>
<div className="bg-light border">Third item</div>
</Stack>
);
}
export default App;