html - CSS不扩展？

Question

我正在做一个我自己创建的项目（www.deepsecurity.org），将来人们可以粘贴更多内容。

不过，我对该项目有问题，如果您检查站点并检查粘贴了某人的“圣经”，您可以清楚地看到该帖子超出了黑屏，您将无法再阅读其余内容。

我怎样才能解决这个问题？尝试了几个小时。

我正在使用Flask + SQLAlchemy + WTForms和Pygments。

看一下CSS（我写了很早的CSS，对此感到抱歉）

style.css

@import url('topbar_style.css');
@import url('errors.css');
@import url('showcodes.css');
@import url('addcode.css');
@import url('highlight.css');
@import url('about.css');
@import url('login.css');

html {
    font-family: 'Lucida Console', Monaco, monospace;
    font-size: 13px;
    color: #FFFFFF;
    background: #F2F2F2 url('images/bg_body.png') repeat-x 0 0;
    display: inline-block
}

.page {
    overflow: hidden;
    margin: 3em auto;
    width: 950px;
    display: inline-block
    border: 5px solid #ccc;
    padding: 0.8em;
    border: 1px solid #383838;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background: #202020;
}

div.codes h1 {
    font-family: 'Lucida Console', Monaco, monospace;
    margin: 0px;
    color: #F2F2F2;
    border-bottom: 2px solid #eee;
}

h2 { 
    font-size: 15px;
}

div.about-text { 
    white-space: pre; 
}

div.codes {
    white-space: pre;
}

showcodes.css

.codes {
    display: inline;
    list-style: none; 
    margin: 0; 
    padding: 0;
}

.codes li { 
    margin: 0.2em 1em;
}

Answer 1

好的，因此，此页面有两个问题：


style.css，第44行

div.codes {
    white-space: pre;
}

删除它。
在页面的“圣经”部分，粘贴具有<code><pre>标记，该标记基本上强制文本为“未格式化” http://reference.sitepoint.com/html/pre
您可以将所有代码/前置元素更改为div或p，也可以简单地将此行添加到css文件中：

code {
    white-space: normal;
}

问题解决了！