Fix pre to break word on overflow

[blogbundle] / Resources / public / css / screen.css

diff --git a/Resources/public/css/screen.css b/Resources/public/css/screen.css
index 3b0382bd1132ff60808d9836aaa3ec99e226de95..7227a83e18ba6e5b1e230f112eaf7ec9c19360d7 100644 (file)
--- a/Resources/public/css/screen.css
+++ b/Resources/public/css/screen.css
@@ -36,8 +36,13 @@ h2 {
 }
 
 h3 {
-       font-size: 1.17rem;
-       margin: 1.17rem 0;
+       font-size: 1.25rem;
+       line-height: 1.65rem;
+       font-family: 'Lemon',sans-serif;
+       color: #09c;
+       text-shadow: 1.5px 1.5px 3px #136;
+       /*font-size: 1.17rem;
+       margin: 1.17rem 0;*/
 }
 
 h4 {
@@ -458,96 +463,44 @@ p.message {
 }
 
 /* Article */
-#article,
-#contact,
-#keyword {
-       margin: .5rem 0;
-       border-radius: .5rem;
-       border: .1rem solid #00c3f9;
-       padding: .5rem;
-       overflow-x: hidden;
-}
-
-#article header,
-#contact header,
-#keyword header {
-       background-color: #00c3f9;
-       margin: -.5rem -.5rem .5rem -.5rem;
-       padding: .5rem;
-       color: #0063c9;
-}
-
-#article header h3,
-#contact header h3,
-#keyword header h3 {
-       margin: 0;
-}
-
-#article header p,
-#keyword header p {
-       margin: 0;
-       font-size: .75rem;
-       display: flex;
-       justify-content: space-between;
-}
-
-#article a,
-#keyword a {
-       color: #0063c9;
-}
-
-#article p,
-#article pre,
-#article ul,
-#contact div,
-#keyword p,
-#keyword pre,
-#keyword ul {
+article p,
+article pre,
+article ul {
        margin-bottom: .5rem;
 }
 
-#article p,
-#keyword p {
-       text-align: justify;
-       text-justify: distribute;
+article p:last-child {
+       margin-bottom: 0;
 }
 
-#article p:last-child,
-#contact div:last-child {
-       margin-bottom: none;
+article ul {
+       margin-top: -.5rem;
+       list-style: "- " inside none;
+       padding-left: .5rem;
 }
 
-#contact input,
-#contact textarea {
-       width: 24rem;
-       padding: 2px;
-       border: 1px solid #00c3f9;
+article li {
+       margin-bottom: .3rem;
 }
 
-#contact button.submit {
-       width: 4rem;
-       margin: 0 10rem;
+article li:last-child {
+       margin-bottom: 0;
 }
 
-#contact div div:last-child {
-       text-align: center;
+article ul:first-child {
+       margin-top: none;
 }
 
-#article pre {
+article pre {
        border-radius: .5rem;
        border: .1rem solid #00c3f9;
        padding: .5rem;
+       margin-bottom: 1rem;
        color: #0063c9;
+       white-space: pre-wrap;
+       word-wrap: break-word;
+       word-break: break-all;
        overflow-x: auto;
-       margin-bottom: 1rem;
-}
-
-#article ul {
-       margin-top: -.5rem;
-}
-
-#article ul:first-child {
-       margin-top: none;
 }
 
 #footer {