# Issue with chat on iPads running iOS 12.5

**URL:** <https://meta.discourse.org/t/issue-with-chat-on-ipads-running-ios-12-5/241184>\
**Category:** UX\
**Tags:** chat, tablet\
**Created:** [October 6, 2022, 8:45pm UTC](https://meta.discourse.org/t/issue-with-chat-on-ipads-running-ios-12-5/241184 "2022-10-06T20:45:20Z")\
**Posts on this page:** 1\
**Showing post:** 9

<div class="post-metadata">

**Author:** ![bletch](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bletch/32/69088_2.png) [@bletch](https://meta.discourse.org/u/bletch)\
**Post date:** [October 13, 2022, 8:15pm UTC](https://meta.discourse.org/t/issue-with-chat-on-ipads-running-ios-12-5/241184/9 "2022-10-13T20:15:38Z")

</div>

tl;dr I’ve created a theme component that appears to get around the problem but would like to validate the CSS / approach I’ve used.

### Update

An update on this. I’ve created a simple theme component that I’m going to test live tomorrow but it _looks like_ it makes Discourse Chat workable on iOS 12.5.

Shout-out to the good people at [BrowserStack](https://www.browserstack.com/) who graciously provided debug access to a cloud-based iPad running 12.x under their open-source program.

Whilst this solution seems workable, I’d **really** appreciate a review by anyone with real CSS knowledge as I’ve simply guessed and Google’d my way to this point.

### What was happening?

I mentioned that the issue seemed to be somewhat ‘random’. It turns out that the size of the chat composer entry box is inversely proportionate to the entire height of the scrollable text (not just the visible text) in the chat messages container `div`.

So, if there aren’t many messages in a particular channel, the chat composer height appears normal. As more messages appear in the channel, so the chat composer height shrinks.

### Additional issue

In addition to the shrinking `textarea` problem, I also noticed that the “back to channels” button (chevron / less than) was slightly out of alignment.

 ![image](https://global.discourse-cdn.com/meta/original/4X/e/f/9/ef9cdae39bbe5e61bd9c41179b967a63a7fb84a7.png)

### The solution?

For the “back to channels” button, the following CSS places it back in alignment…

```css
div.topic-chat-float-container .chat-drawer .topic-chat-drawer-header {
    align-items: center;
}

```

See…

 ![image](https://global.discourse-cdn.com/meta/original/4X/6/f/0/6f0adadc73c3680172b347bdbe27a16772b32200.png)

Using BrowserStack I was able to target the shrinking chat composer container `div. I found that if I applied this CSS…

```css
.chat-composer-container {
    flex-shrink: 0;
}

```

…it maintains the height of the chat composer container no matter what the size of the chat content.

Like so…

 ![image](https://global.discourse-cdn.com/meta/original/4X/6/4/3/64327e0d75a8d27e8db53c7be4151fefd85797ae.png)

I’m happy to maintain the theme component for my iPad users on 12.5, but would just like to know if this CSS approach is valid / optimum / dangerous.

Thanks!

---

_[View the full topic](https://meta.discourse.org/t/issue-with-chat-on-ipads-running-ios-12-5/241184)._