Menu styling fixes for IE. Props filosofo, ocean90. fixes #13388 #13348

git-svn-id: http://svn.automattic.com/wordpress/trunk@14761 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-admin/css/ie.dev.css

@@ -103,6 +103,7 @@ ul#adminmenu {
 }
 
 #adminmenu,
+.major-publishing-actions,
 .wp-submenu,
 .wp-submenu li,
 .wp-menu-toggle {
@@ -442,3 +443,27 @@ table.ie-fixed {
 * html input {
 	border: 1px solid #dfdfdf;
 }
+
+#nav-menu-header,
+#nav-menus-frame,
+#wpbody,
+.menu li {
+	zoom:100%;
+}
+
+#update-nav-menu {
+	border:1px solid #ccc;
+	overflow:hidden;
+}
+#nav-menu-header,
+#update-nav-menu #post-body {
+	border:none;
+}
+
+.menu li {
+	min-width:100%;
+}
+
+.menu li.sortable-placeholder {
+	min-width:400px;
+}

wp-admin/css/nav-menu.dev.css

@@ -18,7 +18,7 @@ body {
 }
 
 #wpbody-content #menu-settings-column {
-	display:block;
+	display:inline;
 	width:281px;
 	margin-left: -300px;
 	clear: both;
@@ -30,6 +30,7 @@ body {
 	}
 
 #menu-settings-column .inside {
+	clear: both;
 	padding:0 10px;
 }
 
@@ -166,7 +167,7 @@ body {
 	}
 
 /* Menu Toolbar */
-#menu-management #major-publishing-actions #delete-action {
+#menu-management .major-publishing-actions #delete-action {
 	float: right;
 	margin-right: 10px;
 }
@@ -176,7 +177,8 @@ body {
 }
 
 #wpbody .open-label {
-	display: inline-block;
+	display: block;
+	float:left;
 }
 #wpbody .open-label span {
 	padding-right: 10px;
@@ -210,7 +212,13 @@ body {
 /* Button Primary Actions */
 #menu-container .submit { margin: 0px 0px 10px; padding: 0px; }
 
-.submitdelete, .submitclose { font-size: 11px; }
+.meta-sep,
+.submitdelete, 
+.submitclose {
+	display:block;
+	float:left;
+	font-size: 11px;
+}
 #cancel-save { color: #ff0000; text-decoration: underline; font-size: 11px; margin-left: 20px; margin-top: 5px; }
 #cancel-save:hover { background-color: #FF0000; color: #fff; }
 
@@ -225,7 +233,10 @@ body {
 	vertical-align: middle;
 }
 
-.button-controls { margin: 10px 0; }
+.button-controls { 
+	clear:both;
+	margin: 10px 0;
+}
 .show-all, .hide-all { cursor: pointer; }
 .hide-all { display: none; }
 
@@ -270,6 +281,7 @@ body {
 }
 .menu li {
 	margin-bottom: 0;
+	position:relative;
 }
 .menu-item-bar {
 	clear:both;
@@ -391,6 +403,7 @@ body.js .item-order {
 /* Menu editing */
 .menu-item-settings {
 	background: #F9F9F9;
+	display:block;
 	width: 400px;
 	padding: 10px 0 10px 10px;
 	border: solid #E6E6E6;
@@ -401,11 +414,11 @@ body.js .item-order {
 	-khtml-border-bottom-right-radius: 6px;
 	-khtml-border-bottom-left-radius: 6px;
 }
-.menu-item-settings.menu-item-edit-active {
+.menu-item-settings-active {
 	display:block;
 }
 
-.menu-item-settings.menu-item-edit-inactive {
+.menu-item-settings-inactive {
 	display:none;
 }
 
@@ -454,8 +467,8 @@ body.js .item-order {
 	line-height: 25px;
 }
 .save-menu-item {
-	padding-left: 10px;
 	float: right;
+	padding-left: 10px;
 }
 
 #cancel-save { cursor: pointer; }
@@ -467,7 +480,9 @@ body.js .item-order {
 
 /* Major/minor publishing actions (classes) */
 .major-publishing-actions {
+clear:both;
 	padding: 5px 10px;
+	zoom:1;
 }
 .major-publishing-actions .publishing-action {
 	text-align: right;
@@ -498,5 +513,19 @@ body.js .item-order {
 
 
 /* Clearfix */
-#nav-menus-frame:after, .menu-item-settings:after, .button-controls:after, #menu-item-url-wrap:after, #menu-item-name-wrap:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
+#menu-item-name-wrap:after,
-#nav-menus-frame, .menu-item-settings, .button-controls, #menu-item-url-wrap, #menu-item-name-wrap { display: block; }
+#menu-item-url-wrap:after, 
+#menu-name-label:after,
+#menu-settings-column .inside:after,
+#nav-menus-frame:after, 
+#post-body-content:after,
+.button-controls:after, 
+.major-publishing-actions:after,
+.menu-item-settings:after {
+	clear: both; 
+	content: ".";
+	display: block;
+	height: 0; 
+	visibility: hidden;
+}
+#nav-menus-frame, .button-controls, #menu-item-url-wrap, #menu-item-name-wrap { display: block; }

wp-admin/includes/nav-menu.php

@@ -62,9 +62,9 @@ class Walker_Nav_Menu_Edit extends Walker_Nav_Menu  {
 		<li id="menu-item-<?php echo $item_id; ?>" class="menu-item menu-item-depth-<?php echo $depth; ?> menu-item-<?php echo esc_attr( $item->object ); ?>">
 			<dl class="menu-item-bar <?php
 				if ( isset($_GET['edit-menu-item']) && $item_id == $_GET['edit-menu-item'] )
-					echo 'menu-item-edit-active';
+					echo 'menu-item-edit-active menu-item-bar-active';
 				else
-					echo 'menu-item-edit-inactive';
+					echo 'menu-item-edit-inactive menu-item-bar-inactive';
 			?>">
 				<dt class="menu-item-handle">
 					<span class="item-title"><?php echo esc_html( $item->title ); ?></span>
@@ -106,9 +106,9 @@ class Walker_Nav_Menu_Edit extends Walker_Nav_Menu  {
 
 			<div class="menu-item-settings <?php
 				if ( isset($_GET['edit-menu-item']) && $item_id == $_GET['edit-menu-item'] )
-					echo 'menu-item-edit-active';
+					echo 'menu-item-edit-active menu-item-settings-active';
 				else
-					echo 'menu-item-edit-inactive';
+					echo 'menu-item-edit-inactive menu-item-settings-inactive';
 			?>" id="menu-item-settings-<?php echo $item_id; ?>">
 				<?php if( 'custom' == $item->type ) : ?>
 					<p class="field-url description description-wide">
@@ -178,7 +178,7 @@ class Walker_Nav_Menu_Edit extends Walker_Nav_Menu  {
 							remove_query_arg($removed_args, admin_url( 'nav-menus.php' ) )
 						),
 						'delete-menu_item_' . $item_id
-					); ?>"><?php _e('Remove'); ?></a> | <a class="item-close submitclose" id="close-<?php echo $item_id; ?>" href="<?php echo admin_url( 'nav-menus.php' ); ?>"><?php _e('Close'); ?></a>
+					); ?>"><?php _e('Remove'); ?></a> <span class="meta-sep"> | </span> <a class="item-close submitclose" id="close-<?php echo $item_id; ?>" href="<?php echo admin_url( 'nav-menus.php' ); ?>"><?php _e('Close'); ?></a>
 					<input class="button-primary save-menu-item" name="save_menu_item" type="submit" value="<?php esc_attr_e('Save Menu Item'); ?>" />
 				</div>
 
@@ -490,7 +490,6 @@ function wp_nav_menu_item_link_meta_box() {
 			</span>
 		</p>
 
-		<div class="clear"></div>
 	</div><!-- /.customlinkdiv -->
 	<?php
 }
@@ -655,7 +654,6 @@ function wp_nav_menu_item_post_type_meta_box( $object, $post_type ) {
 			</span>
 		</p>
 
-		<br class="clear" />
 	</div><!-- /.posttypediv -->
 	<?php
 }
@@ -823,7 +821,6 @@ function wp_nav_menu_item_taxonomy_meta_box( $object, $taxonomy ) {
 			</span>
 		</p>
 
-		<br class="clear" />
 	</div><!-- /.taxonomydiv -->
 	<?php
 }

wp-admin/js/nav-menu.dev.js

@@ -230,6 +230,10 @@ var wpNavMenu;
 					}
 					// Update the item data.
 					ui.item.updateParentMenuItemDBId();
+
+					// address sortable's incorrectly-calculated top in opera
+					ui.item[0].style.top = 0;
+
 				},
 				change: function(e, ui) {
 					// Make sure the placeholder is inside the menu.

wp-admin/nav-menus.php

@@ -496,7 +496,6 @@ require_once( 'admin-header.php' );
 								<label class="menu-name-label howto open-label" for="menu-name">
 									<span><?php _e('Menu Name'); ?></span>
 									<input name="menu-name" id="menu-name" type="text" class="menu-name regular-text menu-item-textbox input-with-default-title" title="<?php esc_attr_e('Enter menu name here.'); ?>" value="<?php echo esc_attr( $nav_menu_selected_title  ); ?>" />
-									<br class="clear" />
 								</label>
 
 								<div class="publishing-action">
@@ -508,7 +507,6 @@ require_once( 'admin-header.php' );
 									<a class="submitdelete deletion menu-delete" href="<?php echo esc_url( wp_nonce_url( admin_url('nav-menus.php?action=delete&amp;menu=' . $nav_menu_selected_id), 'delete-nav_menu-' . $nav_menu_selected_id ) ); ?>"><?php _e('Delete Menu'); ?></a>
 								</div><!--END .delete-action-->
 								<?php endif; ?>
-								<br class="clear" />
 							</div><!--END .major-publishing-actions-->
 						</div><!--END #submitpost .submitbox-->
 						<?php wp_nonce_field( 'closedpostboxes', 'closedpostboxesnonce', false ); ?>
@@ -537,7 +535,6 @@ require_once( 'admin-header.php' );
 								echo '<p>' . sprintf( __('For more information on this feature, see the <a href="%s">Custom Menus</a> article in the Codex.'), _x('http://codex.wordpress.org/Custom_Menus', 'Custom Menus codex page') ) . '</p>';
 								echo '</div>';
 							endif; ?>
-							<br class="clear" />
 						</div><!-- /#post-body-content-->
 					</div><!--- /#post-body -->
 				</form><!--/#update-nav-menu-->