Skip to content

Commit 4e528e4

Browse files
committed
feat: adds a ns-c-center-item helper class for centering an item in parent div
1 parent a9ba641 commit 4e528e4

2 files changed

Lines changed: 18 additions & 0 deletions

File tree

docs/styling.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,18 @@ If you want to make bullets a little closer together to make spaceadd the `class
6060

6161
Other options are `ns-c-tight` and `ns-c-supertight`.
6262

63+
## Centering content
64+
65+
If you have a div and want to to appear in the center of enclosing element:
66+
67+
```md
68+
<div class="ns-c-center-item">
69+
This is centered
70+
</div>
71+
```
72+
73+
This sets the `margin-left` and `margin-right` to `auto` and the `width` to `fit-content`.
74+
6375
## `v-clicks` faders
6476

6577
If you want to fade out a bullet as you step through, add the `class='ns-c-fader'`

styles/neversink-c.css

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,12 @@
6060
align-items: start;
6161
}
6262

63+
.ns-c-center-item {
64+
margin-left: auto;
65+
margin-right: auto;
66+
width: fit-content;
67+
}
68+
6369
.ns-c-center {
6470
justify-content: center; /* Horizontally center the content */
6571
text-align: center;

0 commit comments

Comments
 (0)