From 9d83597a15524896fb1062f74e6bfb142f8a9510 Mon Sep 17 00:00:00 2001 From: Thomas von Deyen Date: Wed, 2 Aug 2023 14:06:45 +0200 Subject: [PATCH 1/3] Format alchemy skins with prettier --- app/assets/stylesheets/alchemy/jquery-ui.scss | 64 +++++++++---- .../tinymce/skins/alchemy/skin.min.css.scss | 89 +++++++++++-------- 2 files changed, 98 insertions(+), 55 deletions(-) diff --git a/app/assets/stylesheets/alchemy/jquery-ui.scss b/app/assets/stylesheets/alchemy/jquery-ui.scss index ae3dd4b79a..3097137694 100644 --- a/app/assets/stylesheets/alchemy/jquery-ui.scss +++ b/app/assets/stylesheets/alchemy/jquery-ui.scss @@ -134,24 +134,31 @@ /* Interaction states ----------------------------------*/ -.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { +.ui-state-default, +.ui-widget-content .ui-state-default, +.ui-widget-header .ui-state-default { border: 1px solid $button-border-color; background-color: #ededed; font-weight: normal; color: $text-color; } -.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { +.ui-state-default a, +.ui-state-default a:link, +.ui-state-default a:visited { color: $text-color; text-decoration: none; } -.ui-state-hover a, .ui-state-hover a:hover { +.ui-state-hover a, +.ui-state-hover a:hover { color: $dark-gray; text-decoration: none; } -.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { +.ui-state-active, +.ui-widget-content .ui-state-active, +.ui-widget-header .ui-state-active { color: $text-color; text-decoration: none; text-shadow: none; @@ -181,7 +188,9 @@ top: 7px; } -.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { +.ui-state-active a, +.ui-state-active a:link, +.ui-state-active a:visited { color: $text-color; text-decoration: none; } @@ -193,40 +202,56 @@ /* Interaction Cues ----------------------------------*/ -.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { +.ui-state-highlight, +.ui-widget-content .ui-state-highlight, +.ui-widget-header .ui-state-highlight { border: 1px solid $dark-gray; background: $light-blue; color: $text-color; } -.ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a { +.ui-state-highlight a, +.ui-widget-content .ui-state-highlight a, +.ui-widget-header .ui-state-highlight a { color: $text-color; } -.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error { +.ui-state-error, +.ui-widget-content .ui-state-error, +.ui-widget-header .ui-state-error { border: 1px solid #cd0a0a; background: #cd0a0a; color: #ffffff; } -.ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { +.ui-state-error a, +.ui-widget-content .ui-state-error a, +.ui-widget-header .ui-state-error a { color: #ffffff; } -.ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { +.ui-state-error-text, +.ui-widget-content .ui-state-error-text, +.ui-widget-header .ui-state-error-text { color: #ffffff; } -.ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { +.ui-priority-primary, +.ui-widget-content .ui-priority-primary, +.ui-widget-header .ui-priority-primary { font-weight: normal; } -.ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { +.ui-priority-secondary, +.ui-widget-content .ui-priority-secondary, +.ui-widget-header .ui-priority-secondary { font-weight: normal; } -.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { - opacity: .35; +.ui-state-disabled, +.ui-widget-content .ui-state-disabled, +.ui-widget-header .ui-state-disabled { + opacity: 0.35; background-image: none; } @@ -351,7 +376,9 @@ background-color: $light-gray; height: $tabs-height; - a { cursor: default } + a { + cursor: default; + } } } @@ -367,11 +394,14 @@ background: $light-gray; } -.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { +.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, +.ui-tabs .ui-tabs-nav li.ui-state-disabled a, +.ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: default; } -.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { +.ui-tabs .ui-tabs-nav li a, +.ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } diff --git a/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss b/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss index 22420f5734..f72936e692 100644 --- a/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss +++ b/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss @@ -44,7 +44,7 @@ } .mce-container::-webkit-scrollbar-thumb { - background-color: rgba(53,57,71,0.3); + background-color: rgba(53, 57, 71, 0.3); width: 6px; height: 6px; border-radius: $default-border-radius; @@ -84,7 +84,7 @@ div.mce-fullscreen { } .mce-tinymce { - visibility: visible!important; + visibility: visible !important; position: relative; display: block; border-radius: $default-border-radius; @@ -98,7 +98,7 @@ div.mce-fullscreen { } div.mce-edit-area { - background: #FFF; + background: #fff; filter: none; border-top: 0; border-radius: $default-border-radius; @@ -222,7 +222,7 @@ div.mce-tinymce-inline { position: absolute; background-color: #000; border: 1px solid #888; - border-color: rgba(85,85,85,0.6); + border-color: rgba(85, 85, 85, 0.6); width: 5px; height: 100%; -webkit-border-radius: 7px; @@ -237,7 +237,7 @@ div.mce-tinymce-inline { .mce-scrollbar.mce-active, .mce-scrollbar:hover { - background-color: #AAA; + background-color: #aaa; opacity: 0.6; filter: alpha(opacity=60); zoom: 1; @@ -289,12 +289,12 @@ div.mce-tinymce-inline { filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); background: transparent; border-radius: $default-border-radius; - box-shadow: 0 5px 10px rgba(0,0,0,0.2); + box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); top: 0; left: 0; background: #fff; border: 1px solid $default-border-color; - border: 1px solid rgba(0,0,0,0.25); + border: 1px solid rgba(0, 0, 0, 0.25); } &.mce-popover.mce-bottom { @@ -307,7 +307,7 @@ div.mce-tinymce-inline { margin-left: -11px; border-top-width: 0; border-bottom-color: $default-border-color; - border-bottom-color: rgba(0,0,0,0.25); + border-bottom-color: rgba(0, 0, 0, 0.25); top: -11px; } @@ -444,7 +444,9 @@ div.mce-tinymce-inline { border-radius: $default-border-radius; border: 0 none; - &:hover, &:focus, &:active { + &:hover, + &:focus, + &:active { width: auto !important; background: $button-hover-bg-color !important; border-color: $button-hover-border-color; @@ -516,14 +518,14 @@ body .mce-abs-layout-item { .mce-tooltip { position: absolute; padding: 5px; - transition-delay: .3s; + transition-delay: 0.3s; } .mce-tooltip-inner { background-color: $tooltip-background-color; color: $white; max-width: 200px; - padding: $default-padding 2*$default-padding; + padding: $default-padding 2 * $default-padding; text-align: center; white-space: normal; box-shadow: 0 0 4px $default-border-color; @@ -671,6 +673,7 @@ body .mce-abs-layout-item { color: $text-color; text-align: center; overflow: visible; + appearance: none; -webkit-appearance: none; border-radius: inherit; box-shadow: none; @@ -785,13 +788,13 @@ body .mce-abs-layout-item { .mce-btn-group .mce-first { border-left: 1px solid #b1b1b1; - border-left: 1px solid rgba(0,0,0,0.25); + border-left: 1px solid rgba(0, 0, 0, 0.25); @include border-left-radius($default-border-radius); } .mce-btn-group .mce-last { border-right: 1px solid #b1b1b1; - border-right: 1px solid rgba(0,0,0,0.1); + border-right: 1px solid rgba(0, 0, 0, 0.1); @include border-right-radius($default-border-radius); } @@ -811,13 +814,20 @@ i.mce-i-checkbox { margin: 0 3px 0 0; border: 1px solid #c5c5c5; border-radius: $default-border-radius; - box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), + 0 1px 2px rgba(0, 0, 0, 0.05); background-color: #f0f0f0; - background-image: -moz-linear-gradient(top,#fff,#d9d9d9); - background-image: -webkit-gradient(linear,0 0,0 100%,from(#fff),to(#d9d9d9)); - background-image: -webkit-linear-gradient(top,#fff,#d9d9d9); - background-image: -o-linear-gradient(top,#fff,#d9d9d9); - background-image: linear-gradient(to bottom,#fff,#d9d9d9); + background-image: -moz-linear-gradient(top, #fff, #d9d9d9); + background-image: -webkit-gradient( + linear, + 0 0, + 0 100%, + from(#fff), + to(#d9d9d9) + ); + background-image: -webkit-linear-gradient(top, #fff, #d9d9d9); + background-image: -o-linear-gradient(top, #fff, #d9d9d9); + background-image: linear-gradient(to bottom, #fff, #d9d9d9); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr= '#ffffffff',endColorstr='#ffd9d9d9',GradientType=0); zoom: 1; @@ -934,7 +944,7 @@ i.mce-i-checkbox { *display: inline; *zoom: 1; border-radius: $default-border-radius; - box-shadow: inset 0 1px 1px rgba(0,0,0,0.075); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); *height: 32px; } @@ -1086,7 +1096,7 @@ i.mce-i-checkbox { display: inline-block; *display: inline; *zoom: 1; - text-shadow: 0 1px 1px rgba(255,255,255,0.75); + text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); border: 0; overflow: hidden; } @@ -1361,10 +1371,10 @@ div.mce-menu .mce-menu-item-sep { min-width: 160px; background: #fff; border: 1px solid #989898; - border: 1px solid rgba(0,0,0,0.2); + border: 1px solid rgba(0, 0, 0, 0.2); z-index: 1002; border-radius: $default-border-radius; - box-shadow: 0 5px 10px rgba(0,0,0,0.2); + box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); max-height: 400px; overflow: auto; overflow-x: hidden; @@ -1438,9 +1448,11 @@ i.mce-i-resize { } .mce-splitbtn .mce-open.mce-active { - -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.05); - -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.05); - box-shadow: inset 0 2px 4px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.05); + -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), + 0 1px 2px rgba(0, 0, 0, 0.05); + -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), + 0 1px 2px rgba(0, 0, 0, 0.05); + box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); } .mce-splitbtn.mce-btn-small .mce-open { @@ -1479,7 +1491,7 @@ i.mce-i-resize { border-width: 0 1px 0 0; background: #e3e3e3; padding: 8px; - text-shadow: 0 1px 1px rgba(255,255,255,0.75); + text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); height: 13px; cursor: pointer; } @@ -1561,29 +1573,30 @@ i.mce-i-resize { opacity: 0.6; filter: alpha(opacity=60); zoom: 1; - background: #fff url('tinymce/skins/alchemy/fonts/img/loader.gif') no-repeat center center; + background: #fff url("tinymce/skins/alchemy/fonts/img/loader.gif") no-repeat + center center; } @font-face { - font-family: 'tinymce'; - src: url('tinymce/skins/alchemy/fonts/tinymce.woff') format('woff'), - url('tinymce/skins/alchemy/fonts/tinymce.ttf') format('truetype'), - url('tinymce/skins/alchemy/fonts/tinymce.svg#tinymce') format('svg'); + font-family: "tinymce"; + src: url("tinymce/skins/alchemy/fonts/tinymce.woff") format("woff"), + url("tinymce/skins/alchemy/fonts/tinymce.ttf") format("truetype"), + url("tinymce/skins/alchemy/fonts/tinymce.svg#tinymce") format("svg"); font-weight: normal; font-style: normal; } @font-face { - font-family: 'tinymce-small'; - src: url('tinymce/skins/alchemy/fonts/tinymce-small.woff') format('woff'), - url('tinymce/skins/alchemy/fonts/tinymce-small.ttf') format('truetype'), - url('tinymce/skins/alchemy/fonts/tinymce-small.svg#tinymce') format('svg'); + font-family: "tinymce-small"; + src: url("tinymce/skins/alchemy/fonts/tinymce-small.woff") format("woff"), + url("tinymce/skins/alchemy/fonts/tinymce-small.ttf") format("truetype"), + url("tinymce/skins/alchemy/fonts/tinymce-small.svg#tinymce") format("svg"); font-weight: normal; font-style: normal; } .mce-ico { - font-family: 'tinymce', Arial; + font-family: "tinymce", Arial; font-style: normal; font-weight: normal; font-size: 12px; @@ -1599,7 +1612,7 @@ i.mce-i-resize { } .mce-btn-small .mce-ico { - font-family: 'tinymce-small', Arial; + font-family: "tinymce-small", Arial; } .mce-i-save:before { From 79f04d42c224bf5eaf4b0fe03d8569ee84f509dc Mon Sep 17 00:00:00 2001 From: Thomas von Deyen Date: Wed, 2 Aug 2023 14:08:14 +0200 Subject: [PATCH 2/3] Remove usage of non-standard zoom CSS property --- app/assets/stylesheets/alchemy/jquery-ui.scss | 1 - .../tinymce/skins/alchemy/skin.min.css.scss | 16 ---------------- 2 files changed, 17 deletions(-) diff --git a/app/assets/stylesheets/alchemy/jquery-ui.scss b/app/assets/stylesheets/alchemy/jquery-ui.scss index 3097137694..b9ff9ea3a9 100644 --- a/app/assets/stylesheets/alchemy/jquery-ui.scss +++ b/app/assets/stylesheets/alchemy/jquery-ui.scss @@ -339,7 +339,6 @@ .ui-tabs { position: relative; padding: 0; - zoom: 1; margin: 0; border-style: none; border-width: 0; diff --git a/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss b/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss index f72936e692..2276d558f9 100644 --- a/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss +++ b/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss @@ -206,7 +206,6 @@ div.mce-tinymce-inline { right: 2px; opacity: 0.4; filter: alpha(opacity=40); - zoom: 1; } .mce-scrollbar-h { @@ -240,7 +239,6 @@ div.mce-tinymce-inline { background-color: #aaa; opacity: 0.6; filter: alpha(opacity=60); - zoom: 1; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; @@ -643,7 +641,6 @@ body .mce-abs-layout-item { text-shadow: $button-text-shadow; display: inline-block; *display: inline; - *zoom: 1; box-shadow: none; background-color: $light-gray; @@ -704,7 +701,6 @@ body .mce-abs-layout-item { box-shadow: none; opacity: 0.4; filter: alpha(opacity=40); - zoom: 1; } &.mce-active, @@ -757,7 +753,6 @@ body .mce-abs-layout-item { .mce-caret { display: inline-block; *display: inline; - *zoom: 1; width: 0; height: 0; vertical-align: top; @@ -830,7 +825,6 @@ i.mce-i-checkbox { background-image: linear-gradient(to bottom, #fff, #d9d9d9); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr= '#ffffffff',endColorstr='#ffd9d9d9',GradientType=0); - zoom: 1; text-indent: -10em; *font-size: 0; *line-height: 0; @@ -942,7 +936,6 @@ i.mce-i-checkbox { .mce-combobox { display: inline-block; *display: inline; - *zoom: 1; border-radius: $default-border-radius; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); *height: 32px; @@ -979,13 +972,11 @@ i.mce-i-checkbox { box-shadow: none; opacity: 0.4; filter: alpha(opacity=40); - zoom: 1; } .mce-path { display: inline-block; *display: inline; - *zoom: 1; padding: 4px 6px; white-space: normal; } @@ -1002,7 +993,6 @@ i.mce-i-checkbox { .mce-path-item { display: inline-block; *display: inline; - *zoom: 1; cursor: pointer; color: #333; } @@ -1044,7 +1034,6 @@ i.mce-i-checkbox { .mce-fit-layout { display: inline-block; *display: inline; - *zoom: 1; } .mce-fit-layout-item { @@ -1054,7 +1043,6 @@ i.mce-i-checkbox { .mce-flow-layout-item { display: inline-block; *display: inline; - *zoom: 1; } .mce-flow-layout-item { @@ -1095,7 +1083,6 @@ i.mce-i-checkbox { .mce-label { display: inline-block; *display: inline; - *zoom: 1; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); border: 0; overflow: hidden; @@ -1256,7 +1243,6 @@ i.mce-i-checkbox { .mce-menu-shortcut { display: inline-block; *display: inline; - *zoom: 1; padding: 0 15px 0 20px; } @@ -1486,7 +1472,6 @@ i.mce-i-resize { .mce-tab { display: inline-block; *display: inline; - *zoom: 1; border: 1px solid #c5c5c5; border-width: 0 1px 0 0; background: #e3e3e3; @@ -1572,7 +1557,6 @@ i.mce-i-resize { height: 100%; opacity: 0.6; filter: alpha(opacity=60); - zoom: 1; background: #fff url("tinymce/skins/alchemy/fonts/img/loader.gif") no-repeat center center; } From c399583b292ce5920ae422dec1365848c59471a3 Mon Sep 17 00:00:00 2001 From: Thomas von Deyen Date: Wed, 2 Aug 2023 14:12:22 +0200 Subject: [PATCH 3/3] Remove IE6 specific CSS hacks --- .../tinymce/skins/alchemy/skin.min.css.scss | 29 ------------------- 1 file changed, 29 deletions(-) diff --git a/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss b/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss index 2276d558f9..57ae52c6e8 100644 --- a/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss +++ b/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss @@ -297,7 +297,6 @@ div.mce-tinymce-inline { &.mce-popover.mce-bottom { margin-top: 10px; - *margin-top: 0; } &.mce-popover.mce-bottom > .mce-arrow { @@ -640,7 +639,6 @@ body .mce-abs-layout-item { position: relative; text-shadow: $button-text-shadow; display: inline-block; - *display: inline; box-shadow: none; background-color: $light-gray; @@ -665,7 +663,6 @@ body .mce-abs-layout-item { padding: 2px 4px; font-size: 12px; line-height: 20px; - *line-height: 16px; cursor: pointer; color: $text-color; text-align: center; @@ -731,13 +728,11 @@ body .mce-abs-layout-item { .mce-btn-small button { padding: 1px 5px; font-size: 12px; - *padding-bottom: 2px; } .mce-btn-small i { line-height: 20px; vertical-align: top; - *line-height: 18px; } .mce-btn .mce-caret { @@ -752,7 +747,6 @@ body .mce-abs-layout-item { .mce-caret { display: inline-block; - *display: inline; width: 0; height: 0; vertical-align: top; @@ -826,9 +820,6 @@ i.mce-i-checkbox { background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr= '#ffffffff',endColorstr='#ffd9d9d9',GradientType=0); text-indent: -10em; - *font-size: 0; - *line-height: 0; - *text-indent: 0; overflow: hidden; } @@ -935,10 +926,8 @@ i.mce-i-checkbox { .mce-combobox { display: inline-block; - *display: inline; border-radius: $default-border-radius; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - *height: 32px; } .mce-combobox input { @@ -976,7 +965,6 @@ i.mce-i-checkbox { .mce-path { display: inline-block; - *display: inline; padding: 4px 6px; white-space: normal; } @@ -992,7 +980,6 @@ i.mce-i-checkbox { .mce-path-item { display: inline-block; - *display: inline; cursor: pointer; color: #333; } @@ -1033,7 +1020,6 @@ i.mce-i-checkbox { .mce-fit-layout { display: inline-block; - *display: inline; } .mce-fit-layout-item { @@ -1042,7 +1028,6 @@ i.mce-i-checkbox { .mce-flow-layout-item { display: inline-block; - *display: inline; } .mce-flow-layout-item { @@ -1082,7 +1067,6 @@ i.mce-i-checkbox { .mce-label { display: inline-block; - *display: inline; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); border: 0; overflow: hidden; @@ -1146,7 +1130,6 @@ i.mce-i-checkbox { color: #333; margin-right: 2px; line-height: 20px; - *line-height: 16px; } .mce-menubtn.mce-btn-small span { @@ -1164,10 +1147,6 @@ i.mce-i-checkbox { width: 70px; } -.mce-menubtn .mce-caret { - *margin-top: 6px; -} - .mce-rtl .mce-menubtn button { direction: rtl; text-align: right; @@ -1242,7 +1221,6 @@ i.mce-i-checkbox { .mce-menu-shortcut { display: inline-block; - *display: inline; padding: 0 15px 0 20px; } @@ -1254,7 +1232,6 @@ i.mce-i-checkbox { .mce-menu-item .mce-caret { margin-top: 4px; - *margin-top: 3px; margin-right: 6px; border-top: 4px solid transparent; border-bottom: 4px solid transparent; @@ -1267,10 +1244,6 @@ i.mce-i-checkbox { border-left-color: #fff; } -.mce-menu-align .mce-menu-shortcut { - *margin-top: -2px; -} - .mce-menu-align .mce-caret, .mce-menu-align .mce-menu-shortcut { position: absolute; @@ -1372,7 +1345,6 @@ div.mce-menu .mce-menu-item-sep { .mce-menu-has-icons i { display: inline-block; - *display: inline; } .mce-menu-sub-tr-tl { @@ -1471,7 +1443,6 @@ i.mce-i-resize { .mce-tab { display: inline-block; - *display: inline; border: 1px solid #c5c5c5; border-width: 0 1px 0 0; background: #e3e3e3;