手机浏览器博文页面目录溢出问题

[brianway]

在手机浏览器(微信里或者UC浏览器里)打开下面的文章：

http://brianway.github.io/2017/05/04/Learning-Notes-Understanding-the-Weird-Parts-of-JavaScript/

侧滑页面发现目录按钮溢出了，空出很大一片空白。我不知道是不是和break-word的设置有关系，因为我点击该目录按钮发现段落标题过长的话并没有分行，还是在一行，导致目录过宽。

关于break-word 的问题我已经提了一个issue: #64

在电脑上使用 chrome 浏览器对宽度进行缩放是没问题的，目录里子标题过长能自动换行，但在手机上就出问题了。

下面是我在微信浏览器里的截图

希望能解惑。

[brianway]

这个 bug 貌似没解决，手机浏览器打开目录的按钮还是在文章右侧很远处，溢出。

[TangMingliang95]

@brianway 可以在chrome里调试，不要直接调宽度，而是切换成移动版。 这个不是不分行的问题，实际上是分行了的，如下图，中间一行是分行了的。 我猜测问题有可能是出在某些CSS设置导致移动端布局出现错误。 @Gaohaoyang 建议reopen这个issue。

[brianway]

@TangMingliang95 我按你说的，在 chrome 里调试，并没有分行。。。

第一张是目录按钮溢出在右侧的截图，第二张是点开目录按钮后标题没分行的截图。

[TangMingliang95]

@brianway 我在我的环境下做了一些测试：

1. 手机微信浏览器，和你的一样是没换行的。
2. chrome，按照你的图中的分辨率，responsive 352*669，我的表现仍然是换行了的，在inheri后换行，并且因为换行导致侧栏宽度减少，所以锚标的位置相对于你截图显示的，向右偏移的并没有那么多。
3. chrome 其他分辨率的测试，在宽度150-400的时候，我的"Object-Oriented ..."这行都是在inheri后换行的，从低于149开始，换行位置开始改变，向更前的地方移动。

这是我得到的一些信息，希望对你有所帮助。