# Guessing the keyboard height on iOS

**URL:** https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919
**Category:** UX
**Created:** [9월 28, 2017, 6:52오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919 "2017-09-28T06:52:51Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![ChrisBeach](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chrisbeach/32/214628_2.png) [@ChrisBeach](https://meta.discourse.org/u/ChrisBeach)
#### Post date: [9월 28, 2017, 6:52오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/1 "2017-09-28T06:52:51Z")

</div>

Not sure if it’s related to the upgrade but the notorious iPhone discourse editor height issue is back when “Predictive” is enabled (and I believe the iOS default is Predictive enabled):

 ![0FD96C87-7F9B-434D-8F40-3F6B6EFAA83C](https://global.discourse-cdn.com/meta/original/3X/0/2/020197985f29c1c12bdc43accb8018dee16fad78.jpg)

As you can see, the important “reply” button is obscured, which will be very confusing for new users.

The discourse editor is fine with Predictive disabled.

---

<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: [9월 28, 2017, 7:15오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/2 "2017-09-28T07:15:43Z")

</div>

Unrelated … this is just ios being SUPER annoying. I am going to reduce a few heights now.

---

<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: [9월 28, 2017, 7:17오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/3 "2017-09-28T07:17:57Z")

</div>

What device are you using there? I tested on iOS 11 iPhone 7 and @codinghorror tested on iOS 11 iPhone 8 plus.

Going to test iPads now.

---

<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: [9월 28, 2017, 7:33오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/4 "2017-09-28T07:33:56Z")

</div>

GRRR bingo … found the bug … this is such a nightmare… there are 2 inner heights I need to work with … one when the bottom `< >` etc is showing … and one when it is not…

---

<div class="post-metadata">

### Author: ![ChrisBeach](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chrisbeach/32/214628_2.png) [@ChrisBeach](https://meta.discourse.org/u/ChrisBeach)
#### Post date: [9월 28, 2017, 7:43오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/5 "2017-09-28T07:43:01Z")

</div>

I’m on iPhone 7, iOS 11 - glad you found the bug!

---

<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: [9월 28, 2017, 7:43오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/6 "2017-09-28T07:43:31Z")

</div>

I am less glad … this thing just behaves totally randomly … it is mega annoying.

---

<div class="post-metadata">

### Author: ![ChrisBeach](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chrisbeach/32/214628_2.png) [@ChrisBeach](https://meta.discourse.org/u/ChrisBeach)
#### Post date: [9월 28, 2017, 8:02오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/7 "2017-09-28T08:02:42Z")

</div>

Good stuff, @sam. It’s once again usable on iOS.

While you’re looking at it, is there any way the editor could resize to always fill this space when Predictive is disabled?

 ![4C822CB4-AE65-4D69-B1DC-CB51256050EA](https://global.discourse-cdn.com/meta/original/3X/f/b/fb8652148528f25ebfc52137a22c5c72df3748d0.jpeg)

It does seem to fill this space when replying sometimes:

 ![6C51B576-75FA-4626-BDBC-D45B1309B71B](https://global.discourse-cdn.com/meta/original/3X/d/c/dceb10b09fb15996e1e9875de8aaf41ba9170e7a.jpg)

---

<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: [9월 28, 2017, 8:04오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/8 "2017-09-28T08:04:28Z")

</div>

No, it is impossible for me to “predict” if predictive text is enabled or not.

Closest I could do is pass it in via the app so we reduce the fudge factor once it is disabled.

---

<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: [9월 28, 2017, 8:11오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/9 "2017-09-28T08:11:15Z")

</div>

More hax

[https://twitter.com/samsaffron/status/913314919369469954](https://twitter.com/samsaffron/status/913314919369469954)

It seems to be working better than the last round of hacks, so at least there is that.

---

<div class="post-metadata">

### Author: ![ChrisBeach](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chrisbeach/32/214628_2.png) [@ChrisBeach](https://meta.discourse.org/u/ChrisBeach)
#### Post date: [9월 28, 2017, 8:13오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/10 "2017-09-28T08:13:37Z")

</div>

I think there’s different behaviour between the reply-to-topic and reply-to-post

This is reply-to-topic with Predictive enabled:

 ![52219C86-C3DA-4E15-B4C6-5766B94DF940](https://global.discourse-cdn.com/meta/original/3X/a/0/a05e72c808f37d7143450c5c903a2266a4473475.jpg)

But reply-to-post is fine now:

 ![A89341E6-34A4-4615-8469-832D02F1F2EB](https://global.discourse-cdn.com/meta/original/3X/8/5/85bc9cd95902ddcc82120e3f7c65d0cfb573a86d.jpg)

---

<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: [9월 28, 2017, 8:17오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/11 "2017-09-28T08:17:13Z")

</div>

You need to wait for my latest fixes to land, I fixed this.

---

<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: [9월 28, 2017, 8:27오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/12 "2017-09-28T08:27:09Z")

</div>

Also, you may notice how the address bar shrinks… we need to magically account for that as well.

---

<div class="post-metadata">

### Author: ![ChrisBeach](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chrisbeach/32/214628_2.png) [@ChrisBeach](https://meta.discourse.org/u/ChrisBeach)
#### Post date: [9월 28, 2017, 8:44오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/13 "2017-09-28T08:44:53Z")

</div>

> [@sam](#):
>
> you may notice how the address bar shrinks… we need to magically account for that as well.

Yikes. I don’t envy you guys here. It’s a really complex problem to solve.

I wonder if the best solution is a radical one. Move the Reply and Upload buttons to the top (position them absolutely so they’re not affected by scrolling). Then make the text box big - if it flows offscreen, this won’t be an issue provided we can keep the user’s cursor in view at all times.

---

<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: [9월 28, 2017, 9:08오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/14 "2017-09-28T09:08:56Z")

</div>

Position fixed takes a break when you are entering text in a box

Go to [Search results for '' - Discourse Meta](https://meta.discourse.org/search) start typing in box, notice how header is no longer fixed

---

<div class="post-metadata">

### Author: ![ChrisBeach](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chrisbeach/32/214628_2.png) [@ChrisBeach](https://meta.discourse.org/u/ChrisBeach)
#### Post date: [9월 28, 2017, 9:32오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/15 "2017-09-28T09:32:57Z")

</div>

Ah, bummer, yes. I assume the same is true of a multi-line text box.

Perhaps there’s another way to position elements that is not overriden by text entry on smartphones.

I’ll have a fiddle and report back.

---

<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: [9월 28, 2017, 11:28오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/16 "2017-09-28T11:28:54Z")

</div>

I am not sure anything exists but I would ❤ be proved wrong, it would make me super happy 🍶 ⛵

In the meantime I just committed an amendment to that hack that accounts for “shrunk vs non-shrunk” address bar. It makes me feel quite bad about myself, but hey it works provided you are using a default keyboard and have predictive text on.

BIG address bar:

 ![193C0D76-992A-459A-A3B7-53E01BFBFCA0](https://global.discourse-cdn.com/meta/original/3X/b/4/b475667dab49760eaad6fbc1b6a2e437c49bd27e.jpg)

Small address bar:

 ![7758721E-32D8-44AF-ACFB-30EB6C430741](https://global.discourse-cdn.com/meta/original/3X/2/9/29397c1012487744b053bb1e1e6aaffdf53c9ae8.jpg)

⏫ notice how `10.0.0.55` is big in the top picture and smaller in the second one. When it is big … you also happen to have a footer on the page that eats up visible space for nav, so we just plug in numbers and 🙏 for peace on 🌏

---

<div class="post-metadata">

### Author: ![ChrisBeach](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chrisbeach/32/214628_2.png) [@ChrisBeach](https://meta.discourse.org/u/ChrisBeach)
#### Post date: [9월 28, 2017, 11:41오전 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/17 "2017-09-28T11:41:28Z")

</div>

👍 please let us know when this is released to meta and I’ll help test.

---

<div class="post-metadata">

### Author: ![jomaxro](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jomaxro/32/126216_2.png) [@jomaxro](https://meta.discourse.org/u/jomaxro)
#### Post date: [9월 28, 2017, 12:35오후 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/18 "2017-09-28T12:35:24Z")

</div>

Not yet deployed. We’ve got a test failing that’s holding up the deploy. Will update when resolved.

---

<div class="post-metadata">

### Author: ![jomaxro](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jomaxro/32/126216_2.png) [@jomaxro](https://meta.discourse.org/u/jomaxro)
#### Post date: [9월 28, 2017, 2:32오후 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/19 "2017-09-28T14:32:01Z")

</div>

FYI the build is fixed, Meta is up to date now.

---

<div class="post-metadata">

### Author: ![ChrisBeach](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chrisbeach/32/214628_2.png) [@ChrisBeach](https://meta.discourse.org/u/ChrisBeach)
#### Post date: [9월 28, 2017, 2:46오후 UTC](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919/20 "2017-09-28T14:46:46Z")

</div>

Looking better now. Still the gap (see screenshot) if Predictive is turned off, but no problems with buttons being hidden:

 ![4C822CB4-AE65-4D69-B1DC-CB51256050EA](https://global.discourse-cdn.com/meta/original/3X/f/b/fb8652148528f25ebfc52137a22c5c72df3748d0.jpeg)

[다음 페이지](https://meta.discourse.org/t/guessing-the-keyboard-height-on-ios/70919.md?page=2)
