# Composer 打开时溢出

**URL:** https://meta.discourse.org/t/composer-overflows-when-open/197484
**Category:** Bug
**Created:** [2021年七月17日 22:36 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484 "2021-07-17T22:36:25Z")
**Posts on this page:** 14
**Page:** 1

<div class="post-metadata">

### Author: ![th21](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/th21/32/211915_2.png) [@th21](https://meta.discourse.org/u/th21)
#### Post date: [2021年七月17日 22:36 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/1 "2021-07-17T22:36:26Z")

</div>

![image](https://global.discourse-cdn.com/meta/original/3X/7/5/75a9969fa13843be880f13dd67d33f2e7c823b33.jpeg)

iPhone 8 的截图：打开编辑器时，界面略微调整大小后，右侧内容溢出屏幕。可以看到“预览”按钮完全被隐藏。

---

<div class="post-metadata">

### Author: ![seanblue](https://avatars.discourse-cdn.com/v4/letter/s/dc4da7/32.png) [@seanblue](https://meta.discourse.org/u/seanblue)
#### Post date: [2021年七月18日 23:17 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/2 "2021-07-18T23:17:56Z")

</div>

我在 iPhone 8 上测试正常。🤔

 ![image](https://global.discourse-cdn.com/meta/original/3X/c/e/ce4298d7840a894b28975f962b844666f5d48141.jpeg)

---

<div class="post-metadata">

### Author: ![th21](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/th21/32/211915_2.png) [@th21](https://meta.discourse.org/u/th21)
#### Post date: [2021年七月18日 23:48 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/3 "2021-07-18T23:48:44Z")

</div>

已录制屏幕。

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [2021年七月19日 03:18 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/4 "2021-07-19T03:18:22Z")

</div>

您安装的是哪个版本的 iOS？

---

<div class="post-metadata">

### Author: ![th21](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/th21/32/211915_2.png) [@th21](https://meta.discourse.org/u/th21)
#### Post date: [2021年七月19日 03:40 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/5 "2021-07-19T03:40:24Z")

</div>

版本为 14.4.2

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [2021年七月19日 03:41 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/6 "2021-07-19T03:41:54Z")

</div>

@设计师们，大家有什么想法吗？是否与手机上的中文区域设置有关？

---

<div class="post-metadata">

### Author: ![th21](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/th21/32/211915_2.png) [@th21](https://meta.discourse.org/u/th21)
#### Post date: [2021年七月19日 03:44 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/7 "2021-07-19T03:44:44Z")

</div>

系统语言已设置为英文，仅默认键盘为中文。如果将默认键盘也设置为英文，该问题仍然会出现。

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [2021年七月19日 03:47 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/8 "2021-07-19T03:47:01Z")

</div>

您能确认一下在安全模式下是否仍然会出现此问题吗？

---

<div class="post-metadata">

### Author: ![th21](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/th21/32/211915_2.png) [@th21](https://meta.discourse.org/u/th21)
#### Post date: [2021年七月19日 03:51 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/9 "2021-07-19T03:51:26Z")

</div>

是的，启用安全模式后问题仍然存在。

---

<div class="post-metadata">

### Author: ![Johani](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/johani/32/176920_2.png) [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [2021年七月19日 07:01 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/10 "2021-07-19T07:01:27Z")

</div>

我无法复现此问题。我观察到的是预期行为——与[此处](https://meta.discourse.org/t/composer-overflows-when-open/197484/2?u=johani)一致。

我在运行 iOS 13 的 iPhone 8 和运行 iOS 14 的 iPhone 11 上都进行了测试。

我没有运行 iOS 14 的 iPhone 8 可供测试，但这可能并非原因所在。

我注意到视频中的按钮似乎缺少一些样式。

在视频中，我看到了这个：

 ![image](https://global.discourse-cdn.com/meta/original/3X/a/9/a9e12d6e59a34deef8ad18465cb232e6dbcad8f1.png)

而我在 iPhone 8 上测试时，看到的是这个：

 ![image](https://global.discourse-cdn.com/meta/original/3X/3/c/3cd8f2a221e9639787385872d1bad067740319c1.png)

同样，与[此处](https://meta.discourse.org/t/composer-overflows-when-open/197484/2?u=johani)一致。

请注意缺失的背景。

这可能是某些样式表未加载的问题？可能是网络问题，也可能是其他原因，我不确定。

@th21 这是否仅在 Meta 上发生，还是其他网站也会出现？  
您还有其他手机可以测试吗？

这将有助于我们进一步缩小问题范围。

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [2021年七月19日 11:39 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/11 "2021-07-19T11:39:47Z")

</div>

这在我使用的另一个 Discourse 论坛上也会相当频繁地发生（那里的最小化编辑器箭头偶尔会跑到屏幕外）。不过，我恐怕不知道如何重现这个问题。

我使用的是 Honor 9，运行 Android 9 系统，并通过 Chrome 浏览器访问。

**编辑：** 抱歉，这可能是一个不同的问题。我刚才尝试了一下，发现对我来说，只有最小化箭头被推到了屏幕外，编辑器的右侧部分并没有受到影响。

我的情况似乎出现在回复标题较长的主题时。而且这似乎只影响我使用的另一个论坛，不影响 Meta 论坛。

---

<div class="post-metadata">

### Author: ![th21](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/th21/32/211915_2.png) [@th21](https://meta.discourse.org/u/th21)
#### Post date: [2021年七月19日 18:16 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/12 "2021-07-19T18:16:28Z")

</div>

这种情况发生在 Meta 和我自己用 Discourse 构建的论坛上。

在 iPhone XR（13.6.1）和 iPhone 6s（12.4.1）上也会出现。

我又录制了一段屏幕视频，注意到不仅是编辑器，整个页面的缩放比例都稍微大了一些。

---

<div class="post-metadata">

### Author: ![th21](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/th21/32/211915_2.png) [@th21](https://meta.discourse.org/u/th21)
#### Post date: [2022年一月22日 07:07 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/13 "2022-01-22T07:07:21Z")

</div>

我做了一些调查，发现这可能是由键盘引起的。页面本身会在键盘出现时放大。

> <https://stackoverflow.com/questions/38619762/how-to-prevent-ios-keyboard-from-pushing-the-view-off-screen-with-css-or-js>

---

<div class="post-metadata">

### Author: ![th21](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/th21/32/211915_2.png) [@th21](https://meta.discourse.org/u/th21)
#### Post date: [2022年一月30日 22:16 UTC](https://meta.discourse.org/t/composer-overflows-when-open/197484/14 "2022-01-30T22:16:04Z")

</div>

我认为这可能与下面这个话题是同一个问题，因为我也看到在移动设备上点击搜索按钮时 UI 会放大。

> [@Mobile UI zooms undesirably on search](https://meta.discourse.org/t/mobile-ui-zooms-undesirably-on-search/115800/17?u=th21):
>
> This commit should fix the issue with the search input zoom in iOS: [https://github.com/discourse/discourse/commit/a452933071b9ad844b02217619aea1a864a02978](https://github.com/discourse/discourse/commit/a452933071b9ad844b02217619aea1a864a02978) The intended behaviour is to enable zooming on touch devices, but iOS automatically zooms on inputs with font size set to less than 16px, which is not a very fun experience, so we’ve implemented a workaround to avoid that auto-zoom.

另外，从这个答案来看，似乎如果我们保留 `maximum-scale=1` 并省略 `user-scale` 属性应该可以解决这个问题。

> <https://stackoverflow.com/questions/2989263/disable-auto-zoom-in-input-text-tag-safari-on-iphone/46254706#46254706>
