.el-article-content { font: 1.2em/1.6em @font-family-serif; max-width: 50em; text-align: justify; blockquote { border-left: 0; // override bootstrap font-family: @font-family-sans-serif; font-size: inherit; font-weight: 300; margin-left: 2em; quotes: "\201C""\201D""\2018""\2019"; &:before { color: @gray; content: open-quote; font-size: 4em; line-height: 0.1em; margin-right: 0.25em; vertical-align: -0.4em; } } img { &:extend(.img-responsive); border: 2px solid #EEE; padding: 5px; } // Syntax Highlight table.highlighttable { table-layout: fixed; width: 100%; td.linenos { @media (max-width:@screen-md) { display:none; } padding-right: 1px; // On Chrome any value higher than 1 breaks width: @el-syntax-highlight-line-no-width; div.linenodiv { pre { background-color: @el-syntax-highlight-line-no-background-color; border-radius: @border-radius-base 0 0 @border-radius-base; color: @el-syntax-highlight-line-no-color; overflow: scroll; text-align: center; } } } td.code { width: 100 - @el-syntax-highlight-line-no-width; div.highlight { // on small screen, no point in displaying custom rounded corner box because // line number column is hidden @media (min-width:@screen-md) { // pygments.css has a rule for div.highlight color. Give it the same border that // descendent pre has. border-radius: 0 @border-radius-base @border-radius-base 0; pre { border-radius: 0 @border-radius-base @border-radius-base 0; // from http://stackoverflow.com/a/10374189/177116 overflow: auto; white-space: pre; word-wrap: normal; } } @media (max-width:@screen-md) { pre { // from http://stackoverflow.com/a/248013/177116 white-space: pre-wrap; /* CSS 3 */ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ white-space: -o-pre-wrap; /* Opera 7 */ white-space: -pre-wrap; /* Opera 4-6 */ word-wrap: break-word; /* Internet Explorer 5.5+ */ } } } } } }