让本论坛帖子页面不被撑宽的样式

我知道大家都用宽屏大屏了，所以这个仅用于分享给还在用窄屏或者跟我一样一直开着侧栏，或者分屏浏览的使用者：

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("www.firefox.net.cn") {
TD[class^="row"] { white-space: normal !important; }
TD[class="row3Right"] { white-space: nowrap !important; }
TD[class^="row"] TD[height="100%"] img {max-width: 600px !important;}
TD[class^="row"] TD[height="100%"] img:active {max-width: 100% !important;}
/*TD[class^="row"] TD[height="100%"] img {cursor: -moz-zoom-in !important;}*/
}

＝＝或者：

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("www.firefox.net.cn") {
TD[class="row1"] { white-space: normal !important; }
TD[class="row2"] { white-space: normal !important; }
TD[class^="row"] TD[height="100%"] img {max-width: 600px !important;}
TD[class^="row"] TD[height="100%"] img:active {max-width: 100% !important;}
/*TD[class^="row"] TD[height="100%"] img {cursor: -moz-zoom-in !important;}*/
}

＝＝＝更新：完善代码
解释：前两行将帖子中的 UA 字符串折行；三四两行将图片宽度上限限制为 600 像素（或按需自行调整），并仅在图片上按下鼠标左键时回复完整大小，松开则变回 600 像素；最后一行让鼠标指针移到帖子正文的图片上时显示为放大镜指针，由于没针对性，默认注释掉。

＝＝＝
另外，除了 UA 和图片，帖子中无空格字符（white space）分隔的字符串也会撑宽页面，这个对 Firefox 来说目前没有 CSS 样式解决办法，只能够用 js 。具体请参考本站原帖：
https://www.firefox.net.cn/forum/viewtopic.php?t=26164

＝＝＝
把这个遗忘了的样式放到 userstyles.org 上了：
http://userstyles.org/styles/22636

旧事重提，不是说 3.5 就支持“word-wrap”属性吗？为什么我用来对付像如下网页时：
https://www.firefox.net.cn/forum/viewtopic.php?t=26164
完全没有效果？

td.row1, td.row2, td.row1 *, td.row2 * {word-wrap: break-word;}

https://developer.mozilla.org/en/CSS/word-wrap
上面是 Mozilla 的官方说明，没看出还需要什么条件。

不过本页面是有效了,而kmc提到的https://www.firefox.net.cn/newforum/viewtopic.php?t=26851依然没效.

请看楼主贴最后一段。

P.S. 顶楼更新，只针对帖子正文中的图片，但无法只针对宽度超限的图片。

抱歉,我看错了,是usercontent.css而非userChrome.css;

不过本页面是有效了,而kmc提到的https://www.firefox.net.cn/newforum/viewtopic.php?t=26851依然没效.

harnack：放在stylish扩展里。或者放在D:\program files\Minefield\myprofile\chrome\usercontent.css里。回到原帖

我就是在usercontent.css里添加了无效啊

放在stylish扩展里。或者放在D:\program files\Minefield\myprofile\chrome\usercontent.css里。

请问LZ这个代码是在哪里改,是在D:\program files\Minefield\myprofile\chrome\userChrome.css里改吗?怎么改了无效呢?
还是在油猴之类的扩展里改?

harnack：今天发现用了这个样式后有些页面显示会有问题，比如：https://www.firefox.net.cn/forum/viewtopic.php?t=26873&highlight=，左侧被2楼的头像撑宽了。回到原帖

多谢，顶楼已更新

今天发现用了这个样式后有些页面显示会有问题，比如：https://www.firefox.net.cn/forum/viewtopic.php?t=26873&highlight=，左侧被2楼的头像撑宽了。

https://developer.mozilla.org/en/CSS/word-wrap

CSS的话，是这个吗？那就等3.5吧。。。

skmi7：有没有对所有网站都这样的？回到原帖

可以用如下代码：

@namespace url(http://www.w3.org/1999/xhtml);
TD { white-space: normal !important; }
img {max-width: 600px !important;}
img:active {max-width: 100% !important;}

对所有网页匹配，不过误伤会很大，例如一些网页顶头的 banner 就至少 800 像素（没切割的话）。所以还是按需要分别为网站写比较安稳。

有没有对所有网站都这样的？

谢谢楼主，大家可以测试这个帖子
https://www.firefox.net.cn/newforum/view ... hp?t=26851

用了之后图片自动缩小。



Tagged_by_kmc
Firefox, 横向滚动条, 自动缩小, 图片,  CSS, userContent

多谢楼主解释。新加的关于图片的两条很不错，以前图片撑大页面的情形总让人很困扰。

harnack：非常感谢楼主指点，原来主题列表里有row3Right。

顺便问下，有没可能用css实现页面的自动换行呢？比如https://www.firefox.net.cn/forum/viewtopic.php?t=23226&highlight=，由于不能自动断行页面被撑得很宽，但用force wrap的gm脚本或者bookmarklet就会解决这个问题。用css可以吗？回到原帖

Firefox （或者说 CSS 标准）不支持对无间断字符串的强制换行，所以是没办法的。替代方法是加水平滚动条，但不支持 table 及其下属容器（老师有教，table 中的空单元格要加 1X1 的透明图片“撑”起来）。

ps.顶楼更新。