How do I get text fields to display side by side?

    {
      name: 'happyContent',
      type: 'array',
      admin: {
        style: {
          flexDirection: 'row',
        },
      },
      fields: [
        {
          name: 'happyName',
          label: 'happyName',
          type: 'text',
          admin: {
            width: '50%',
          },
          required: false,
        },
        {
          name: 'happyTagID',
          label: 'happy Tag ID',
          type: 'text',
          admin: {
            width: '50%',
          },
          required: false,
        }
      ],
    }

Not working. The easiest for me seems to be to add a classname and style it, but wasn't sure if there's another way