# 特定浏览器宽度下出现水平滚动条

**URL:** https://meta.discourse.org/t/for-specific-browser-widths-horizontal-scroll-bar-appears/83230
**Category:** UX
**Created:** [2018年三月18日 06:13 UTC](https://meta.discourse.org/t/for-specific-browser-widths-horizontal-scroll-bar-appears/83230 "2018-03-18T06:13:12Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![tshenry](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tshenry/32/119495_2.png) [@tshenry](https://meta.discourse.org/u/tshenry)
#### Post date: [2018年三月18日 06:13 UTC](https://meta.discourse.org/t/for-specific-browser-widths-horizontal-scroll-bar-appears/83230/1 "2018-03-18T06:13:12Z")

</div>

Just a minor bug here.

**Repro Steps:**

- Enter a topic with a few existing replies
- Hit reply on the first post
- Scroll down past the last post with the composer open

**Additional notes:**

- Can reproduce in desktop Safari, Chrome and Firefox
- Browser window must be small enough to where the composer is touching the edges of the window
- It seems to trigger when topic-progress indicator detaches from the composer and docks to the last post

Seems to go away with:

```plaintext
#topic-progress-wrapper.docked {
   right: 1px;
}

```

**Illustration:**

 ![x-scroll%20bug](https://global.discourse-cdn.com/meta/original/3X/4/e/4e00c40225e2faf693784cd15c1ae35961067ab6.png)

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [2018年三月20日 00:00 UTC](https://meta.discourse.org/t/for-specific-browser-widths-horizontal-scroll-bar-appears/83230/2 "2018-03-20T00:00:42Z")

</div>

> [@tshenry](#):
>
> Browser window must be small enough to where the composer is touching the edges of the window

Make the browser a bit bigger, then? 😉

---

<div class="post-metadata">

### Author: ![tshenry](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tshenry/32/119495_2.png) [@tshenry](https://meta.discourse.org/u/tshenry)
#### Post date: [2018年三月20日 00:50 UTC](https://meta.discourse.org/t/for-specific-browser-widths-horizontal-scroll-bar-appears/83230/3 "2018-03-20T00:50:11Z")

</div>

🤣 Unfortunately that would require buying a new computer! On a 13" MacBook Pro, the composer touches the edges of the window at maxed browser size.

Here’s another weird thing that can happen because of it:

[https://streamable.com/7y8pc](https://streamable.com/7y8pc)

With that said, this is a minor thing that the majority of users probably won’t encounter.

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [2018年三月20日 01:07 UTC](https://meta.discourse.org/t/for-specific-browser-widths-horizontal-scroll-bar-appears/83230/4 "2018-03-20T01:07:53Z")

</div>

Maybe @awesomerobot can take a look at some point.

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [2018年四月12日 04:02 UTC](https://meta.discourse.org/t/for-specific-browser-widths-horizontal-scroll-bar-appears/83230/5 "2018-04-12T04:02:32Z")

</div>

So turns out the topic progress bar was ~2px wider than its container (likely because of the border?), so when at `right: 0;` and at X/X progress it produced a slight horizontal scroll. The solution was to subtract 2 from the width calculation.

FYI @sam this was the same issue you were seeing.
