From 954c298392a6a9b8552225f179c432bfe68fce80 Mon Sep 17 00:00:00 2001
From: Ian Stewart <iandstewart@git.wordpress.org>
Date: Fri, 3 Jun 2011 21:38:47 +0000
Subject: [PATCH] Twenty Eleven: style 4-column galleries -- Props mfields --
 and remove unneeded !important rules; Fixes #17564

git-svn-id: https://develop.svn.wordpress.org/trunk@18134 602fd350-edb4-49c9-b593-d223f7449a82
---
 wp-content/themes/twentyeleven/style.css | 38 ++++++++++++++++++++----
 1 file changed, 32 insertions(+), 6 deletions(-)

diff --git a/wp-content/themes/twentyeleven/style.css b/wp-content/themes/twentyeleven/style.css
index 803d42dd35..760e803040 100644
--- a/wp-content/themes/twentyeleven/style.css
+++ b/wp-content/themes/twentyeleven/style.css
@@ -883,8 +883,8 @@ p img,
 	left: 10px;
 	top: 7px;
 }
-.gallery {
-	margin: 0 auto 1.625em !important;
+#content .gallery {
+	margin: 0 auto 1.625em;
 }
 #content .gallery a img {
     border: none;
@@ -893,6 +893,14 @@ img#wpstats {
     display: block;
     margin: 0 auto 1.625em;
 }
+#content .gallery-columns-4 .gallery-item {
+	width:23%;
+	padding-right:2%;
+}
+#content .gallery-columns-4 .gallery-item img {
+	width:100%;
+	height:auto;
+}
 
 /* Image borders */
 .entry-content img,
@@ -2267,10 +2275,10 @@ p.comment-form-comment {
 		width: auto;
 	}
 	/* No need to float footer widgets at this size */
-	#supplementary .widget-area {
-		float: none !important;
-		margin-right: 0 !important;
-		width: auto !important;
+	#colophon #supplementary .widget-area {
+		float: none;
+		margin-right: 0;
+		width: auto;
 	}
 	/* No need to float 404 widgets at this size */
 	.error404 #main .widget {
@@ -2335,6 +2343,24 @@ p.comment-form-comment {
 	#respond .comment-form-email .required {
 	    left: 95%;
 	}
+	#content .gallery-columns-3 .gallery-item {
+		width:31%;
+		padding-right:2%;
+	}
+	#content .gallery-columns-3 .gallery-item img {
+		width:100%;
+		height:auto;
+	}
+}
+@media (max-width: 450px) {
+	#content .gallery-columns-2 .gallery-item {
+		width:45%;
+		padding-right:4%;
+	}
+	#content .gallery-columns-2 .gallery-item img {
+		width:100%;
+		height:auto;
+	}
 }
 @media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
 	body {