search

stitchesjs / stitches

[Not Actively Maintained] CSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience.
https://stitches.dev
MIT License
7.74k stars 253 forks source link

Center Text #1112

Open shanewmurphy opened 1 year ago

shanewmurphy commented 1 year ago

Is there any way to center Text??

azuline commented 1 year ago

can you help me center a div too

shanewmurphy commented 1 year ago

@azuline don't know if you're messing with me or not. I'm using NextUI.org for Next js project, NextUI uses Stitches as a style engine. I'm used to styling elements with CSS. With Stitches, to my mind, you jump through any loops just get to basic styling applied.

Center a div width: 90% margin: 0 auto; Will center a div

To center Text with Stitches best wrap components in a div and try to center things that way. Trying to center H1, H2 with CSS{{Align: "center"}} doesn't work

azuline commented 1 year ago

hehe sorry i was

Do you know if this is a NextUI problem or a Stitches problem? Or a CSS problem? If it's the former, asking in NextUI support might produce better results.

In the event it's a CSS problem, have you tried textAlign: "center"?

shanewmurphy commented 1 year ago

I'm centered text with CSS. Nope textAlign: "center will not work with H1, H2, H3 etc

azuline commented 1 year ago

Seems to work in normal HTML/CSS?

image

I'm not fully understanding the problem, but this seems like a problem you're have with styling NextUI (which happens to use Stitches) rather than Stitches specifically?

jrgarciadev commented 1 year ago

Hey @shanewmurphy here's you have an example https://codesandbox.io/s/centered-text-5ihr6t?file=/App.js, hope it helps you

This issue can be closed