stitches icon indicating copy to clipboard operation
stitches copied to clipboard

Published 20 hours ago • verified publisher icon stitchesjs

Center Text

Open shanewmurphy opened this issue 3 years ago • 6 comments

Is there any way to center Text??

shanewmurphy avatar Nov 01 '22 20:11 shanewmurphy

can you help me center a div too

azuline avatar Nov 01 '22 20:11 azuline

@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

shanewmurphy avatar Nov 01 '22 21:11 shanewmurphy

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"?

azuline avatar Nov 01 '22 21:11 azuline

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

shanewmurphy avatar Nov 01 '22 22:11 shanewmurphy

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?

azuline avatar Nov 01 '22 22:11 azuline

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

jrgarciadev avatar Nov 10 '22 01:11 jrgarciadev