Fix img misalign and hide "by" when nothing selected in new wallpaepr picker ui

chrome/browser/resources/chromeos/wallpaper_manager/css/wallpaper_manager.css

Index: chrome/browser/resources/chromeos/wallpaper_manager/css/wallpaper_manager.css
diff --git a/chrome/browser/resources/chromeos/wallpaper_manager/css/wallpaper_manager.css b/chrome/browser/resources/chromeos/wallpaper_manager/css/wallpaper_manager.css
index 868a4e2fd3d3a23811c3972d227d1b297691f514..16469269f27bdb6d1fb06a0c97fde794c3ef136a 100644
--- a/chrome/browser/resources/chromeos/wallpaper_manager/css/wallpaper_manager.css
+++ b/chrome/browser/resources/chromeos/wallpaper_manager/css/wallpaper_manager.css
@@ -82,11 +82,6 @@ div.sidebar-splitter {
   display: -webkit-box;
 }
 
-#category-container[hidden],
-#custom-container[hidden] {
-  display: none;
-}
-
 #custom-container {
   background-color: #FFF;
   margin: 10px;
@@ -121,12 +116,22 @@ div.sidebar-splitter {
   width: 128px;
 }
 
+/* The width and height of img tag need to be set here. Otherwise, an incorrect
+ * image size may be used during layout. Some images may be misaligned as a
+ * result. See http://code.google.com/p/chromium/issues/detail?id=148480 for
+ * screen shot.
+ */
+.image-picker img {
+  height: 80px;
+  width: 128px;
+}
+
 .image-picker [selected][lead] {
   border: 2px solid rgb(0, 102, 204);
   padding: 1px;
 }
 
-.wallpaper-attr {
+#wallpaper-attribute {
   -webkit-box-orient: vertical;
   display: -webkit-box;
 }
@@ -151,6 +156,11 @@ div.sidebar-splitter {
   width: 128px;
 }
 
+/* [hidden] does display:none, but its priority is too low. */
+[hidden] {
+  display: none !important;
+}
+
 /* The butter bar styles are copied from file_manager.css. We will revisit
  * it to see if we can share some code after butter bar is integrated with
  * Photo Editor.