Thumbnails: allow overflow inside thumbnails

overflow:hidden on the thumbnail has been in place like this for a
long time. One of the primary reasons was for long sentences in the
thumbcaption. For that, modern browsers now support word-wrap.
I know of no good reasons why overflow would have to apply to the
rest of the frame. Therfor moved to thumbcaption only, and added
word-wrap.

Bug: T132306
Change-Id: I1953683fa2a6d22ed82bac1acd37e5cb12636381

diff --git a/resources/src/mediawiki.legacy/commonPrint.css b/resources/src/mediawiki.legacy/commonPrint.css
index 77ecfcb..3e6ee56 100644 (file)
--- a/resources/src/mediawiki.legacy/commonPrint.css
+++ b/resources/src/mediawiki.legacy/commonPrint.css
@@ -243,7 +243,6 @@ div.thumbinner {
        background-color: White;
        font-size: 94%;
        text-align: center;
-       overflow: hidden;
 }
 
 html .thumbimage {
@@ -256,6 +255,8 @@ html .thumbcaption {
        line-height: 1.4em;
        padding: 3px !important;
        font-size: 94%;
+       overflow: hidden;
+       word-wrap: break-word;
 }
 
 div.magnify {

diff --git a/resources/src/mediawiki.legacy/oldshared.css b/resources/src/mediawiki.legacy/oldshared.css
index 5d637da..9adfba1 100644 (file)
--- a/resources/src/mediawiki.legacy/oldshared.css
+++ b/resources/src/mediawiki.legacy/oldshared.css
@@ -90,7 +90,6 @@ div.thumbinner {
        background-color: #f9f9f9;
        font-size: 94%;
        text-align: center;
-       overflow: hidden;
 }
 
 html .thumbimage {
@@ -103,6 +102,8 @@ html .thumbcaption {
        padding: 3px;
        font-size: 94%;
        text-align: left;
+       overflow: hidden;
+       word-wrap: break-word;
 }
 
 div.magnify {

diff --git a/resources/src/mediawiki.skinning/content.css b/resources/src/mediawiki.skinning/content.css
index e6f92a5..89f8745 100644 (file)
--- a/resources/src/mediawiki.skinning/content.css
+++ b/resources/src/mediawiki.skinning/content.css
@@ -152,7 +152,6 @@ div.thumbinner {
        background-color: #f9f9f9;
        font-size: 94%;
        text-align: center;
-       overflow: hidden;
 }
 
 html .thumbimage {
@@ -164,6 +163,8 @@ html .thumbcaption {
        line-height: 1.4em;
        padding: 3px;
        font-size: 94%;
+       overflow: hidden;
+       word-wrap: break-word;
        /* Default styles when there's no .mw-content-ltr or .mw-content-rtl, overridden below */
        text-align: left;
 }