¿如何像设计一样对齐复选框？

Question

我正在处理这个布局，这就是设计

但我无法像设计那样对齐复选框，所以我的看起来像这样

这是代码，所以你可以告诉我我做错了什么以及我应该做什么...

  line,
}) {
  return (
    <Row
      width="35em"
    >
      <Text
        color="#73737D"
        fontSize="14px"
      >
        {line}

      </Text>
      <Box
        marginLeft="5em"
        display="flex"
        flexDirection="row"
        justifyContent="center"
        alignItems="center"
        width="2em"
      >
        <CheckBox />
      </Box>
    </Row>
  );
}```

Thanks a lot for your help!

Answer 1

你可以只使用一些 flexbox 样式：

<Row width="35em" style={{ display: 'flex', justifyContent: 'space-between' }}>
  ...
  <Box>
    <CheckBox />
  </Box>
</Row>

¿如何像设计一样对齐复选框？

¿How do I align the checkboxs like the design?

css

reactjs

layout

position