How do I get horizontal alignment?

[DKGH]

I have tried Group and Flex with horizontal direction. Neither worked. What could be the problem?

import { Group, MantineProvider, Text } from '@mantine/core';

function App() {
  return (
    <MantineProvider>
      <Group>
        <Text variant="default">First</Text>
        <Text variant="default">Second</Text>
        <Text variant="default">Third</Text>
      </Group>
    </MantineProvider>
  )
}

export default App

[rtivital]

How can I center element on the page?
https://codesandbox.io/s/recursing-galois-t39fbn

How can I center multiple elements on the page?
https://codesandbox.io/s/gracious-water-wvqxm9

How can I center multiple elements horizontally?
https://codesandbox.io/s/busy-http-m74kq5