在Chrome瀏覽器中代碼區始終有一個滾動條，firefox不會有這種情況。網上有很多解決方法，修改plugin/syntaxhighlisghter/3.0.81/css目錄下shCoreDefault.css中的..syntaxhighlighter區域，加上padding:1px;就可以了。

.syntaxhighlighter { 
width: 100% !important; 
margin: 1em 0 1em 0 !important; 
position: relative !important; 
overflow: auto !important; 
font-size: 1em !important; 
padding:1px;/*就是這個*/
} 

下面是其他網友的補充

SyntaxHighlighter這個是一個高亮插件。現在被用于很多網站的代碼顯示。但是SyntaxHighlighter3.0.83，由于自適應寬和高，導致一直有滾動條的問題。

其實這個問題可以修改css文件可以去掉。修改主題文件shCoreDefault.css（默認模版）

去掉右側滾動條：

大概在shCoreDefault.css文件39行位置：

padding:0 !important;

修改為：

padding: 1px 0 !important;

網上可能是36行 margin: 0 !important;修改為 margin:1px 0 !important;這樣修改雙擊選中后會有錯位問題。

去掉下側的滾動條：

其實我也沒有找到兩全其美的方法，為什么這么說呢。這里我提供2種方法，但是多有缺陷。

建議：還是輸代碼的時候注意長度的，只要不超過一定的長度，是不會出現滾動條的。

1.自動換行

.syntaxhighlighter .line {
white-space: pre !important;
}

修改這個pre為normal的話，前面的行數就會錯位。

2.自動隱藏

.syntaxhighlighter {
width: 100% !important;
margin: 1em 0 1em 0 !important;
position: relative !important;
overflow: auto !important;
font-size: 1em !important;
}

修改overflow的auto為hidden，超過自動隱藏。這個方法更美觀點，但是不方面查看代碼。

到此這篇關于SyntaxHighlighter 去掉右側滾動條的方法的文章就介紹到這了,更多相關SyntaxHighlighter滾動條內容請搜索腳本之家以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持腳本之家！