0

toolbarbutton badge not working with ie11

asked 2020-03-03 18:37:24 +0800

filippoluchini gravatar image filippoluchini
101 2

updated 2020-03-03 21:20:58 +0800

Hello everyone, I've a problem with toolbarbutton badges using IE11 with ZK 8.6.3. Everything works fine with other browsers (Firefox 73.0.1, Chrome 80.0.3987.122, Edge 44.18362.449.0).

Here's an example of the zul file:

<toolbarbutton width="50px" height="50px" iconSclass="z-icon-leaf" sclass="badge-error" orient="vertical" label="Bla bla bla" onClick="@command('doShowAnamnesis')" />

and this is the badge-error class in my _misc.less file:

.badge-error {
    .z-toolbarbutton-content {
        >.z-icon-leaf {
            &:after {
                content: '\f06a';
                font-family: FontAwesome;
                position: absolute;
                vertical-align: middle;
                color: red;
                font-size: .6em;
            }
        }
    }
}

With IE11 the badge is not visible. If I use the same code in a .css file it works correctly. Inspecting the page with ie DOM explorer, when I modify the name of the class, then it works.

What am I doing wrong? Any suggestions?

Thanks in advance.

Filippo

delete flag offensive retag edit

Comments

runnable on fiddle https://zkfiddle.org/sample/1m929ki/1-ie-css-button to confirm, manual CSS works

cor3000 ( 2020-03-04 10:31:55 +0800 )edit

2 Answers

Sort by ยป oldest newest most voted
0

answered 2020-03-04 10:40:40 +0800

cor3000 gravatar image cor3000
6280 2 7

It seems your descriptions are a bit incomplete... (e.g. are you building a custom theme? using the theme-template? or just compile arbitrary less files into CSS?)

More general: What are the steps that lead to the problem? Can you provide the CSS generated by your less compile process and compare to the working CSS I tested in this ZK fiddle? Do you compile in the browser using a client side less compiler? Is the style-sheet loaded by IE at all? Which Theme are you using?

link publish delete flag offensive edit
0

answered 2020-03-05 22:23:11 +0800

filippoluchini gravatar image filippoluchini
101 2

Hi cor3000, thanks for your replay.

My application has a zk-theme library linked. In this library I'm using deepsea compact 8.6.3 theme with some customizations. In the norm.less file I added the import of a _misc.less file with customizations.

The zkless-engine-maven-plugin version is 1.0.0, the less compiler version of my client is 3.9.0.

Using the CSS generated it doesn't work with IE11. Unfortunately my karma is insufficient to publish links, so I'm forced to past it below.

<%@ taglib uri="......./dsp/web/core" prefix="c" %><%@ taglib uri="......./dsp/zk/core" prefix="z" %><%@ taglib uri="......./dsp/web/theme" prefix="t" %>.badge-error .z-toolbarbutton-content>.z-icon-leaf:after{content:'\f06a';font-family:FontAwesome;position:absolute;vertical-align:middle;color:red;font-size:.6em}.z-label,.z-radio-content,.z-checkbox-content,.z-loading{font-size:12px}.z-select{font-size:12px}.z-selectbox{font-size:12px}.z-error{padding:12px 8px}.z-error .messagecontent{font-size:12px;padding:6px 0}.z-error .button{font-size:14px;width:14px;height:14px;margin-left:5px}.z-error .button>.z-icon-times{font-size:14px}.z-error .errornumbers{font-size:12px}.z-loading{top:0;left:0}.z-loading-indicator{padding:10px 16px 4px;line-height:20px}.z-apply-loading-indicator{font-size:12px;padding:3px 4px 3px 28px;position:relative;top:50%}.z-apply-loading-icon,.z-renderdefer{width:20px;height:20px;background:transparent no-repeat center;background-image:url(${c:encodeThemeURL('~./zul/img/misc/progress-32.gif')});background-size:contain}.z-loading-icon{width:20px;height:20px;background:transparent no-repeat center;background-image:url(${c:encodeThemeURL('~./zul/img/misc/progress-72.gif')});background-size:contain;margin-left:-10px;margin-bottom:0}.z-apply-loading-icon{position:absolute;left:2px;top:50%;margin-top:-10px}.z-drop-content{font-size:12px;padding:5px 36px 5px 12px;min-height:32px;line-height:22px}.z-drop-icon{font-size:16px;width:16px;height:16px;line-height:16px;text-align:center;vertical-align:middle}.z-panel-header{line-height:24px;margin:0}.z-panel-header .z-caption{padding:5px 3px 6px}.z-panel-close{line-height:14px}.z-panel-icon{font-size:14px;margin:2px 5px;padding:0}.z-window-header{line-height:24px;margin:0;padding:3px}.z-window-header>.z-caption{padding:0 2px;min-height:0;line-height:0}.z-window-icon{font-size:18px;margin:2px 0;padding:0}.z-window-noborder.z-window-noheader>.z-window-content{padding:0}.z-messagebox-window{padding:3px}.z-messagebox-window .z-window-header,.z-messagebox-window.z-window-modal .z-window-content,.z-messagebox-window .z-window-highlighted .z-window-content{padding:3px 5px}.z-messagebox .z-label{font-size:12px}.z-messagebox-buttons>*{margin-left:4px}.z-messagebox-window .z-window-highlighted .z-window-content{padding:20px 12px 15px 18px}.z-north-header,.z-south-header,.z-west-header,.z-center-header,.z-east-header{font-size:12px;line-height:24px;padding:4px 4px 3px}.z-north-body,.z-south-body,.z-west-body,.z-center-body,.z-east-body{line-height:14px;padding:2px}.z-north-collapsed,.z-south-collapsed,.z-west-collapsed,.z-center-collapsed,.z-east-collapsed{width:32px;height:32px;padding:4px}.z-north-title,.z-south-title,.z-west-title,.z-east-title{font-size:12px;line-height:24px}.z-borderlayout-icon{font-size:12px;display:block;width:24px;height:24px;line-height:24px;position:absolute;right:3px}.z-button{font-size:12px;min-height:24px;padding:2px 11px;line-height:14px}.z-combobutton-content{font-size:12px;line-height:16px;padding:3px 32px 3px 6px}.z-combobutton-content>i{vertical-align:bottom;font-size:16px}.z-combobutton-icon{font-size:16px}.z-combobutton-icon.z-icon-caret-down{margin-top:-8px;position:absolute;top:50%;left:5px}.z-combobutton-image{vertical-align:bottom}.z-combobutton-button{display:block;width:26px;height:100%}.z-combobutton-toolbar .z-combobutton-content{line-height:16px;font-size:12px;padding:3px 32px 3px 6px}.z-menubar{padding:0}.z-menubar-horizontal li{margin:2px}.z-menubar-horizontal .z-menuseparator{line-height:26px;margin:2px 4px}.z-menu-text,.z-menuitem-text{padding:1px;font-size:12px}.z-menu-content,.z-menuitem-content{padding:2px 6px;line-height:14px}.z-menu-content i,.z-menuitem-content i{vertical-align:text-bottom;width:18px;height:18px;line-height:18px;margin-right:5px}.z-menu-content{padding-right:26px}.z-menu-icon{font-size:16px;top:0}.z-menupopup .z-menu-image,.z-menupopup .z-menuitem-image{min-width:16px;min-height:16px}.z-menupopup .z-menu-image,.z-menupopup .z-colorbox-color{min-width:12px;min-height:12px;margin-right:14px}.z-menupopup .z-menuitem-icon{font-size:14px;top:2px;left:7px}.z-menupopup [class^="z-icon"]{min-width:18px;min-height:18px}.z-toolbar{padding:4px 4px 3px;line-height:20px}.z-toolbar.z-toolbar-tabs{min-height:30px}.z-toolbarbutton-content{font-size:12px;line-height:16px;width:100%;overflow:hidden;text-overflow:ellipsis}.z-toolbarbutton-content>img{margin-right:0;font-size:16px;vertical-align:middle}.z-toolbarbutton-content>i{margin-right:0;vertical-align:middle}.z-toolbar-content>*{margin-left:6px}.z-tabbox-left-scroll,.z-tabbox-right-scroll{min-height:32px;width:24px}.z-tabbox-left .z-tabs .z-tab,.z-tabbox-right .z-tabs .z-tab{padding:3px 13px}.z-tabbox-left .z-tabs .z-tab .z-tab-content .z-tab-text,.z-tabbox-right .z-tabs .z-tab .z-tab-content .z-tab-text{padding:0 3px}.z-tabbox-left>.z-tabs .z-tab .z-tab-content>.z-tab-text>.z-tab-image,.z-tabbox-right>.z-tabs .z-tab .z-tab-content>.z-tab-text>.z-tab-image{margin-left:0;margin-right:0}.z-tabbox-up-scroll,.z-tabbox-down-scroll{height:24px}.z-tabbox-left>.z-tab-icon{left:10px;right:auto}.z-tabbox-left>.z-tabs .z-tab{border-right:2px solid transparent}.z-tabbox-left>.z-tabs .z-tab.z-tab-selected{border-right:2px solid #0cafac;-webkit-border-radius:0;-moz-border-radius:0;-o-border-radius:0;-ms-border-radius:0;border-radius:0}.z-tabbox-left>.z-tabs .z-tab-button+.z-tab-text{margin-left:8px}.z-tabbox-right>.z-tabs .z-tab-button{right:10px}.z-tabbox-accordion .z-tabpanel>.z-tabpanel-content{padding:3px}.z-tabbox-accordion .z-tab-button{font-size:14px;right:12px}.z-tabbox-icon{padding:5px 0;line-height:18px}.z-tabbox-scroll>.z-tabs{margin:0 24px}.z-tabbox-right.z-tabbox-scroll>.z-tabbox-icon{padding:4px 0}.z-tabbox-right.z-tabbox-scroll>.z-tabs{margin:24px 0}.z-tabbox-left.z-tabbox-scroll>.z-tabbox-icon{padding:4px 0}.z-tabbox-left.z-tabbox-scroll>.z-tabs{margin:24px 0}.z-tabs{line-height:14px;min-height:32px}.z-tabs-content{min-height:32px}.z-tab{font-size:12px;line-height:20px;padding:3px 13px}.z-tab-image{width:12px;height:12px}.z-tab-text{line-height:24px}.z-tab-icon{margin-top:-6px}.z-tab-button{font-size:12px;display:block;width:14px;height:100%;position:absolute;right:0;top:0}.z-tab-button+.z-tab-text{margin-right:3px}.z-tabpanel{padding:3px}.ie9 .z-tabbox-top .z-tab,.ie10 .z-tabbox-top .z-tab,.ie9 .z-tabbox-left .z-tab,.ie10 .z-tabbox-left .z-tab,.ie9 .z-tabbox-right .z-tab,.ie10 .z-tabbox-right .z-tab,.ie9 .z-tabbox-bottom .z-tab,.ie10 .z-tabbox-bottom .z-tab{height:32px}.ie9 .z-tabbox-left-scroll,.ie10 .z-tabbox-left-scroll,.ie9 .z-tabbox-right-scroll,.ie10 .z-tabbox-right-scroll{min-height:0;height:32px}.ie11 .z-tabbox-top .z-tab,.ie11 .z-tabbox-left .z-tab,.ie11 .z-tabbox-right .z-tab,.ie11 .z-tabbox-bottom .z-tab{min-height:32px}.z-caption{font-size:12px;min-height:24px;line-height:24px}.z-caption-content,.z-caption .z-label{line-height:26px}.z-caption-content{padding:0}.z-caption-content>*{margin-left:4px}.z-caption-image{height:16px;width:16px}.z-caption input{font-size:12px}.z-caption .z-button{padding:2px 11px;font-size:12px}.z-caption .z-a,.z-caption .z-a:visited{font-size:12px}.z-groupbox>.z-groupbox-header{font-size:12px}.z-groupbox-content{font-size:12px;padding:3px}.z-groupbox .z-caption-content>*{margin-left:3px}.z-groupbox-notitle .z-groupbox-content{padding:3px}.z-groupbox-3d>.z-groupbox-header{height:auto;font-weight:bold;background:#ececec;border-bottom:1px solid #bcbcbc}.z-groupbox-3d>.z-groupbox-header .z-caption,.z-groupbox-3d>.z-groupbox-header .z-groupbox-title{padding:0}.z-groupbox-3d>.z-groupbox-header .z-caption-content,.z-groupbox-3d>.z-groupbox-header .z-groupbox-title-content{font-size:12px}.z-groupbox-3d>.z-groupbox-header .z-caption-content,.z-groupbox-3d>.z-groupbox-header .z-groupbox-title-content{line-height:24px;font-size:12px;padding:3px 4px}.z-groupbox-3d>.z-groupbox-header .z-caption-content>.z-caption-image,.z-groupbox-3d>.z-groupbox-header .z-groupbox-title-content>.z-caption-image{margin-left:0;margin-right:0}.z-groupbox-3d>.z-groupbox-content{padding:3px}.z-navbar{padding:0}.z-navbar>ul ul .z-nav-text,.z-navbar>ul ul .z-navitem-text{font-size:12px}.z-navbar-horizontal{line-height:2 20px;padding:0 2px}.z-navbar-horizontal .z-navseparator{line-height:36px}.z-nav-content,.z-navitem-content{padding:6px 12px}.z-nav-image,.z-navitem-image{max-width:16px;max-height:16px}.z-nav-image,.z-navitem-image,.z-nav i,.z-navitem i{margin-right:8px}.z-nav-text,.z-navitem-text{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:12px;font-weight:normal;font-style:normal}.z-nav-info{position:absolute;right:16px;top:8px}.z-nav-text-popup,.z-navitem-text-popup{min-width:180px;height:38px;padding:10px 18px 4px;line-height:20px}.z-nav-popup{padding:0 4px 6px}.z-nav-popup .z-nav-text,.z-nav-popup .z-navitem-text{font-size:12px}.z-navbar-collapsed .z-nav-info{position:relative;top:0;left:0}.z-grid-body .z-grid-emptybody td{font-size:12px}.z-grid-body .z-grid-emptybody .z-grid-emptybody-content{padding:3px 4px;line-height:24px}.z-group-inner .z-group-content,.z-group-inner .z-cell{line-height:24px;padding:3px 4px}.z-group-icon{vertical-align:text-top}.z-grid-body .z-cell{font-size:12px;padding:3px 4px;line-height:24px;text-overflow:ellipsis;white-space:nowrap}.z-column-sort .z-column-sorticon{position:absolute;top:-7px;left:50%}.z-column-button{width:23px;height:32px;line-height:32px}.z-row .z-detail-outer{padding:3px}.z-column-content,.z-group-content,.z-groupfoot-content,.z-footer-content,.z-auxheader-content{font-size:12px;line-height:24px;padding:3px 4px}.z-row-content{font-size:12px;padding:3px 4px}.z-listbox-body .z-listbox-emptybody td{font-size:12px}.z-listbox-body .z-listbox-emptybody .z-listbox-emptybody-content{padding:3px 4px;min-height:32px;line-height:24px}.z-listheader-sort .z-listheader-sorticon{position:absolute;top:-7px;left:50%}.z-listheader-checkable{display:inline-block;width:14px;height:14px;position:relative;left:2px}.z-listheader-checkable:before{display:block;width:8px;height:8px}.z-listitem-checkable{display:inline-block;width:14px;height:14px;position:relative;left:2px}.z-listitem-selected>.z-listcell>.z-listcell-content>.z-listitem-checkable .z-listitem-icon.z-icon-radio{width:8px;height:8px}.z-listgroup-inner .z-listcell-content,.z-listgroup-inner .z-listgroup-content{padding:3px 4px}.z-listgroup-checkable{display:inline-block;width:16px;height:16px;position:relative;left:2px}.z-listgroupfoot .z-listcell-content{padding:3px 4px}.z-listheader-content{font-size:12px;padding:3px 4px;line-height:24px}.z-listcell-content{font-size:12px;padding:5px 4px;line-height:20px;min-height:32px}.z-listgroup-content,.z-listgroupfoot-content,.z-listfooter-content{font-size:12px;padding:3px 4px;line-height:24px;min-height:32px}.z-treerow-checkable{display:inline-block;width:16px;height:16px;font-size:14px;color:#0cafac}.z-treecol-content,.z-treecell-content,.z-treefooter-content{font-size:12px;padding:3px 4px}.z-treecol-content,.z-treefooter-content{line-height:24px}.z-checkbox-switch>.z-checkbox-mold{margin:6px;position:relative;width:38px;height:14px}.z-checkbox-switch>.z-checkbox-mold:before{width:18px;height:18px;left:-2px;bottom:-2px;-webkit-box-shadow:0 2px 4px 0 rgba(0,0,0,0.16);-moz-box-shadow:0 2px 4px 0 rgba(0,0,0,0.16);-o-box-shadow:0 2px 4px 0 rgba(0,0,0,0.16);-ms-box-shadow:0 2px 4px 0 rgba(0,0,0,0.16);box-shadow:0 2px 4px 0 rgba(0,0,0,0.16)}.z-checkbox-switch-on>.z-checkbox-mold:before{-webkit-transform:translateX(26px);-moz-transform:translateX(26px);-o-transform:translateX(26px);-ms-transform:translateX(26px);transform:translateX(26px)}.z-checkbox-toggle>.z-checkbox-mold{width:20px;height:20px}input[type="checkbox"]{margin:0 2px 2px;font-size:12px;width:14px;height:14px;line-height:12px}input[type="radio"]{margin:0 2px 2px;width:14px;height:14px}input[type="radio"]:before{display:block;width:8px;height:8px}.z-textbox,.z-decimalbox,.z-intbox,.z-longbox,.z-doublebox{font-size:12px;height:24px;padding:4px 5px;line-height:14px}.z-errorbox>.z-errorbox-icon{position:absolute;top:5px}.z-errorbox-up+.z-errorbox-icon{top:13px}.z-errorbox-content{font-size:12px;padding:5px 20px 5px 34px;line-height:16px;border:1px solid #b60000}.z-errorbox-icon{position:absolute;top:-6px}.z-combobox,.z-bandbox,.z-datebox,.z-timebox,.z-spinner,.z-doublespinner{height:24px;line-height:20px}.z-combobox-input,.z-bandbox-input,.z-datebox-input,.z-timebox-input,.z-spinner-input,.z-doublespinner-input{font-size:12px;height:24px;line-height:14px;padding:3px 4px}.z-combobox-button,.z-bandbox-button,.z-datebox-button,.z-timebox-button,.z-spinner-button,.z-doublespinner-button{font-size:14px;color:#000;min-width:24px;height:24px;padding:3px}.z-timebox-button,.z-spinner-button,.z-doublespinner-button{width:24px;padding:1px;position:relative}.z-timebox-button>a,.z-spinner-button>a,.z-doublespinner-button>a{height:12px;padding:0}.z-timebox-button>a>i,.z-spinner-button>a>i,.z-doublespinner-button>a>i{-webkit-transform:translateY(-4px);-moz-transform:translateY(-4px);-o-transform:translateY(-4px);-ms-transform:translateY(-4px);transform:translateY(-4px)}.z-timebox-button:hover>i,.z-spinner-button:hover>i,.z-doublespinner-button:hover>i{position:absolute;top:50%}.z-combobox-inplace .z-combobox-input,.z-bandbox-inplace .z-bandbox-input,.z-datebox-inplace .z-datebox-input,.z-timebox-inplace .z-timebox-input,.z-spinner-inplace .z-spinner-input,.z-doublespinner-inplace .z-doublespinner-input{border:0;padding:3px;background:0}.z-combobox-emptySearchMessage{padding:4px 8px;position:relative;min-height:26px}.z-comboitem,.z-comboitem-button{font-size:12px;white-space:nowrap;cursor:pointer}.z-comboitem{padding:3px;position:relative;min-height:20px}.z-comboitem-inner,.z-comboitem-content{font-size:12px;color:rgba(0,0,0,0.57)}.z-comboitem,.z-comboitem a,.z-comboitem a:visited{font-size:12px}.z-comboitem-text{line-height:14px}.z-comboitem-icon{font-size:18px;color:#000;padding-right:4px}.z-combobox-popup,.z-bandbox-popup,.z-datebox-popup,.z-timebox-popup{font-size:12px;padding:3px}.z-popup-content{font-size:12px;padding:3px}.z-paging{height:32px}.z-paging-button{font-size:12px;min-width:24px;height:24px;padding:4px 3px;margin:0}.z-paging .z-paging-icon{font-size:18px;line-height:18px}.z-paging-input{font-size:12px;width:42px;height:24px;padding:0 8px}.z-paging-text{font-size:12px}.z-paging-info{font-size:12px}.z-paging-os .z-paging-button{font-size:12px;padding:4px 3px}.z-progressmeter{height:14px}.z-calendar{font-size:14px;padding:8px 4px}.z-calendar th{font-size:12px}.z-calendar-title{font-size:14px}.z-calendar-header:first-child{line-height:26px}.z-calendar-decade .z-calendar-cell,.z-calendar-month .z-calendar-cell,.z-calendar-year .z-calendar-cell{width:56px;height:44px}.z-calendar-wk.z-calendar .z-calendar-decade .z-calendar-cell,.z-calendar-wk.z-calendar .z-calendar-month .z-calendar-cell,.z-calendar-wk.z-calendar .z-calendar-year .z-calendar-cell{width:64px;height:44px}.z-calendar-cell{font-size:12px;width:32px;height:24px}.z-calendar-icon{font-size:16px;width:24px;height:24px}.z-calendar-right{right:0}.z-calendar-left{left:0}.z-calendar-today{margin-top:5px}.z-calendar-today .z-calendar-title{padding:4px 0}.z-datebox-timezone{font-size:12px}.z-chosenbox{line-height:normal;padding:0 0 2px 0;min-height:25px}.z-chosenbox-item{margin:1px 0 0 2px;padding:0}.z-chosenbox-item-content{font-size:12px;padding:0 2px;margin-right:16px}.z-chosenbox-button{font-size:16px;width:16px;height:16px;line-height:16px;position:absolute;right:2px;top:-1px}.z-chosenbox-input{font-size:12px;display:inline-block;width:17px;height:17px;padding:1px 2px 2px}.z-chosenbox-textcontent{font-size:12px}.z-chosenbox-popup{font-size:12px;padding:3px}.z-chosenbox-option{padding:1px 8px;min-height:16px}.z-chosenbox-empty{padding:1px 8px;min-height:16px}.z-colorbox{display:inline-block;width:48px;height:32px;padding:3px}.z-colorbox-popup,.z-menu-popup{padding:0}.z-colorpicker{width:306px;height:420px;padding:4px}.z-colorpicker-main{top:30px}.z-colorpicker-info{margin-top:12px;height:114px;top:30px}.z-colorpicker-color{width:56px;height:72px;right:8px}.z-colorpicker-newcolor{width:50px;height:33px}.z-colorpicker-current{width:50px;height:33px}.z-colorpicker-rgb .z-colorpicker-input,.z-colorpicker-hsv .z-colorpicker-input{width:40px;margin:0 0 0 8px}.z-colorpicker-rgb{top:5px}.z-colorpicker-hsv{top:40px}.z-colorpicker-text,.z-colorpicker-input{font-size:12px}.z-colorpicker-input{height:24px;text-align:center}.z-colorpicker-hex{position:absolute;top:76px}.z-colorpicker-hex .z-colorpicker-input{width:72px;height:32px;margin-left:8px}.z-colorpicker-button{top:82px;right:8px;width:42px}.z-colorpalette{width:260px;height:226px;padding:4px}.z-colorpalette-head{height:35px}.z-colorpalette-newcolor{width:48px;height:30px;right:77px}.z-colorpalette-input,.z-colorpalette-button{position:absolute;top:0;right:0}.z-colorpalette-input{width:72px;height:30px}.z-colorpalette-color{display:inline-block;width:12px;height:12px}.z-colorbox-paletteicon,.z-menu-paletteicon{left:5px;top:5px}.z-colorbox-pickericon,.z-menu-pickericon{left:30px;top:5px}.z-colorbox-paletteicon,.z-menu-paletteicon,.z-colorbox-pickericon,.z-menu-pickericon{width:22px;height:22px;font-size:16px;padding:3px;line-height:16px}.z-notification-content{font-size:12px;vertical-align:middle;padding:32px 16px 32px 56px}.z-notification-pointer ~ .z-notification-content{display:table-cell;width:260px;height:50px;min-height:50px;padding:8px 34px 8px 48px}.z-notification-close{font-size:14px;width:14px;height:14px;padding:0 2px;line-height:14px}.z-biglistbox-outer{margin:0 15px 15px 0}.z-biglistbox-header-content{font-size:12px;line-height:19px}.z-biglistbox-body td{font-size:12px;line-height:19px}.z-biglistbox-verticalbar-tick{width:7px;height:15px;position:absolute;font-size:16px;bottom:0}.z-biglistbox-verticalbar-tick:before{left:-5px}.z-biglistbox-wscroll-vertical{width:15px;height:100%;position:absolute;right:-16px}.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag{width:15px;height:119px}.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-home,.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-up,.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-down,.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-end{width:15px;height:16px}.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-home:before,.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-up:before,.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-down:before,.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-end:before{position:relative;right:2px}.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-body{width:15px;height:55px;top:32px}.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-body:before{top:19px;right:-1px}.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-body:hover,.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-body:active{top:31px}.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-up{top:16px}.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-up:hover,.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-up:active{top:15px}.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-down{bottom:16px}.z-biglistbox-wscroll-vertical .z-biglistbox-wscroll-endbar{width:15px;height:8px}.z-biglistbox-wscroll-horizontal{width:100%;height:15px;bottom:-16px}.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag{width:119px;height:15px}.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-home,.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-up,.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-down,.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-end{width:16px;height:15px}.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-body{width:55px;height:15px;left:32px}.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-body:before{left:19px;bottom:0}.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-body:hover,.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-body:active{left:31px}.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-up{left:16px;border-left:0}.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-up:hover,.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-up:active{left:15px}.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-down{right:16px}.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-drag .z-biglistbox-wscroll-end{right:0}.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-pos{width:119px;height:15px}.z-biglistbox-wscroll-horizontal .z-biglistbox-wscroll-endbar{width:7px;height:15px;position:absolute;right:-12px}.z-rating{font-size:14px;line-height:14px}.z-rating>.z-rating-icon{padding:3px 2px;width:20px;height:20px}.z-timepicker{min-height:24px}.z-timepicker-input{font-size:12px;height:24px;line-height:12px}.z-timepicker-button{font-size:18px;color:#000;min-width:24px;height:24px;padding:3px 0 0}.z-timepicker-option{font-size:12px;padding:3px}.z-timepicker-popup{padding:3px}.z-a{font-size:12px}.z-organigram{overflow:auto;font-size:12px;line-height:14px}.z-orgnode{padding:4px 10px}.z-cropper-toolbar>ul>li{padding:5px 11px}.z-goldenlayout .lm_header{line-height:24px;min-height:30px;font-size:12px}.z-goldenlayout .lm_header .lm_tab{line-height:24px;top:-1px;padding:4px 12px 3px}.z-goldenlayout .lm_header .lm_tab .lm_title{line-height:24px}.z-goldenlayout .lm_header .lm_tab .lm_close_tab{width:12px;height:12px;top:0}.z-goldenlayout .lm_header .lm_tab.lm_active:after{margin:-1px -13px}.z-goldenlayout .lm_header .lm_controls{padding:0}.z-goldenlayout .lm_header .lm_controls>li{width:12px;line-height:12px;padding:9px 11px 2px 5px}.z-goldenlayout-dragProxy .lm_header .lm_tabs{font-size:12px}.z-goldenlayout-dragProxy .lm_header .lm_tabs .lm_tab{font-size:12px;padding:4px 12px 3px;line-height:24px}.z-goldenlayout-dragProxy .lm_header .lm_tabs .lm_tab:after{margin:-10px -12px}.z-signature-toolbar{position:absolute;bottom:6px;right:10px}.z-signature-toolbar-hide{display:none}.z-signature-tool-button{font-size:12px;min-height:24px;margin-right:5px}.z-signature-tool-button-icon{font-size:16px}

Comparing it to your CSS I can't see differences about badge-error class.

Thanks for your help.

Filippo

link publish delete flag offensive edit

Comments

I increased your karma, please provide a link to a runnable version so I can check directly. or contact our support in case you need more dedicated help.

cor3000 ( 2020-03-06 11:59:36 +0800 )edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow
1 follower

RSS

Stats

Asked: 2020-03-03 18:37:24 +0800

Seen: 8 times

Last updated: Mar 05 '20

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More