Добавить горизонтальную прокрутку в поле кода

В моем блоге есть кодовое поле, в которое я добавляю коды HTML / CSS / Javascript

Мой код CSS выглядит так:

.post blockquote {
    background-image: url("https://dl.dropbox.com/u/76401970/All%20Blogger%20Tricks/Images/blockquote.png");
    background-position: 0 0;
    background-repeat: no-repeat repeat;
    border-color: #DDDDDD #666666 #666666 #DDDDDD;
    border-radius: 6px 6px 6px 6px;
    border-style: solid;
    border-width: 1px;
    color: #000000;
    font-family: Consolas,'Courier New',Monaco,Courier,monospace;
    line-height: 18px;
    margin: 0 20px;
    overflow: hidden;
    padding: 10px 20px 10px 45px;
}

Всякий раз, когда я добавляю большой код (одна строка). Код переходит к следующей строке, но я хочу, чтобы код находился в той же строке, а под полем была горизонтальная прокрутка. Я пробовал overflow: auto overflow-x: scroll overflow-y: hidden