From: Fomafix <fomafix@googlemail.com>
Date: Fri, 3 Jan 2014 16:38:40 +0000 (+0000)
Subject: Use box-sizing:border-box for textarea
X-Git-Tag: 1.31.0-rc.0~17126^2
X-Git-Url: http://git.cyclocoop.org/%7B%24www_url%7Dadmin/compta/operations/?a=commitdiff_plain;h=8e860ac29d55123cd87c68bc6fe9a5a5846f96ae;p=lhc%2Fweb%2Fwiklou.git

Use box-sizing:border-box for textarea

Bug 40610 identified an overflowing textarea for #editform and fixed this.
All textarea elements overflows because they use the following CSS
definition from skins/common/commonElements.css:

textarea {
    width: 100%;
    padding: .1em;
}

In standard compliance mode of the box model this generates a width
of 100% plus .1em for the border box. To create a border box with a
width of 100% definition box-sizing:border-box should be added:

textarea {
    width: 100%;
    padding: .1em;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

Bug: 56692
Change-Id: Ife1cf74ca33b4f53ec052947bd8b7b2fd28705ce
---

diff --git a/resources/mediawiki/mediawiki.feedback.js b/resources/mediawiki/mediawiki.feedback.js
index 1afe51eff6..9de69b29ed 100644
--- a/resources/mediawiki/mediawiki.feedback.js
+++ b/resources/mediawiki/mediawiki.feedback.js
@@ -106,12 +106,12 @@
 						$( '<div style="margin-top: 1em;"></div>' ).append(
 							mw.msg( 'feedback-subject' ),
 							$( '<br>' ),
-							$( '<input type="text" class="feedback-subject" name="subject" maxlength="60" style="width: 99%;"/>' )
+							$( '<input type="text" class="feedback-subject" name="subject" maxlength="60" style="width: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;"/>' )
 						),
 						$( '<div style="margin-top: 0.4em;"></div>' ).append(
 							mw.msg( 'feedback-message' ),
 							$( '<br>' ),
-							$( '<textarea name="message" class="feedback-message" style="width: 99%;" rows="5" cols="60"></textarea>' )
+							$( '<textarea name="message" class="feedback-message" rows="5" cols="60"></textarea>' )
 						)
 					),
 					$( '<div class="feedback-mode feedback-bugs"></div>' ).append(
diff --git a/skins/cologneblue/screen.css b/skins/cologneblue/screen.css
index bc5dd316cf..40a943296d 100644
--- a/skins/cologneblue/screen.css
+++ b/skins/cologneblue/screen.css
@@ -56,9 +56,6 @@ p, pre, .mw-code, td, th, li, dd, dt {
 textarea {
 	overflow: auto;
 	width: 100%;
-}
-
-#editform textarea {
 	display: block;
 	-moz-box-sizing: border-box;
 	-webkit-box-sizing: border-box;
diff --git a/skins/common/commonContent.css b/skins/common/commonContent.css
index 35071a452f..a8699233cb 100644
--- a/skins/common/commonContent.css
+++ b/skins/common/commonContent.css
@@ -150,16 +150,6 @@ img.thumbborder {
 	border: 1px solid #dddddd;
 }
 
-/**
- * Edit forms
- */
-#editform textarea {
-	display: block;
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-}
-
 /**
  * Basic styles for the user login and create account forms
  */
diff --git a/skins/common/commonElements.css b/skins/common/commonElements.css
index 742f839c2e..ad7942a667 100644
--- a/skins/common/commonElements.css
+++ b/skins/common/commonElements.css
@@ -207,6 +207,10 @@ form {
 textarea {
 	width: 100%;
 	padding: .1em;
+	display: block;
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
 }
 select {
 	vertical-align: top;
diff --git a/skins/common/config.css b/skins/common/config.css
index 39206c3a00..d64627376e 100644
--- a/skins/common/config.css
+++ b/skins/common/config.css
@@ -138,5 +138,6 @@
 }
 
 #config-live-log {
-	margin-right: 18em;
+	overflow: hidden;
+	min-width: 20em;
 }
diff --git a/skins/modern/main.css b/skins/modern/main.css
index 5da7d5bd76..6f73f0e1df 100644
--- a/skins/modern/main.css
+++ b/skins/modern/main.css
@@ -155,8 +155,7 @@ div.mw_clear {
 textarea {
 	width: 100%;
 	padding: .1em;
-}
-#editform textarea {
+	display: block;
 	-moz-box-sizing: border-box;
 	-webkit-box-sizing: border-box;
 	box-sizing: border-box;