jsx button宽度固定，且可以随页面大小自动换行

如果你想要创建一个宽度固定的按钮，并且希望在页面尺寸变化时自动换行，可以使用CSS的`flex`布局来实现。具体做法如下：

1. 在父元素上设置`display: flex`，这样子元素就可以按照一行排列。

2. 设置子元素的`flex-basis`属性为固定宽度，例如`flex-basis: 100px`。

3. 在父元素上设置`flex-wrap: wrap`，这样当子元素的宽度之和超过父元素宽度时，子元素就会自动换行。

下面是示例代码：

<div style={{ display: 'flex', flexWrap: 'wrap' }}>
  <button style={{ flexBasis: '100px', height: '40px' }}>按钮1</button>
  <button style={{ flexBasis: '100px', height: '40px' }}>按钮2</button>
  <button style={{ flexBasis: '100px', height: '40px' }}>按钮3</button>
  <button style={{ flexBasis: '100px', height: '40px' }}>按钮4</button>
  <button style={{ flexBasis: '100px', height: '40px' }}>按钮5</button>
  <button style={{ flexBasis: '100px', height: '40px' }}>按钮6</button>
  <button style={{ flexBasis: '100px', height: '40px' }}>按钮7</button>
  <button style={{ flexBasis: '100px', height: '40px' }}>按钮8</button>
</div>

在上面的代码中，我们将父元素设置为`display: flex`，并且设置了`flex-wrap: wrap`，子元素的宽度为固定的100像素，高度为40像素。当父元素的宽度不足以容纳所有子元素时，子元素会自动换行，从而实现了随页面尺寸自动换行的效果。