Home >
front end > Compatibility mode, can not be fixed at the bottom of the browser display
Compatibility mode, can not be fixed at the bottom of the browser display
CSS:
/* the CSS Document returned to the top and the bottom right hand corner */
. The toolbar - item. The toolbar - layer {background: url (../img/toolbar. PNG) no - repeat; }
. The toolbar {
position: fixed;
right: 0px;
bottom: 0px;
text-align: right;
}/* assumptions page width to 1200 px, the navigation bar on the right side suspension */
. The toolbar - item {display: block; width:52px; height:52px; margin-top:1px; position:relative; Moz - the transition: background - 1 s position; - ms - the transition: background - 1 s position; - o - moz - the transition: background - 1 s position; - its - moz - the transition: background - 1 s position; The transition: background - 1 s position; }
The toolbar - item: hover. The toolbar - layer {opacity: 1; filter:alpha(opacity=100); The transform: scale (1); -webkit-transform:scale(1); Moz - transform: scale (1); - ms - transform: scale (1); -o-transform:scale(1); }
. The toolbar - item - weixin {background - position: 0-798 px; }
The toolbar - item - weixin: hover {background - position: 0-860 px; }
. The toolbar - item - weixin. The toolbar - layer {height: 212 px; background-position:0 0; }
. The toolbar - item - feedback {background - position: 0-426 px; }
The toolbar - item - feedback: hover {background - position: 0-488 px; }
. The toolbar - item - app {background - position: 0-550 px; }
The toolbar - item - app: hover {background - position: 0-612 px; }
. The toolbar - item - app. The toolbar - layer {height: 194 px; Background - position: 0-222 px; }
. The toolbar - item - top {background - position: 0-674 px; }
The toolbar - item - top: hover {background - position: 0-736 px; }
. The toolbar - layer {position: absolute; Right: 46 px; Bottom: - 10 px; Width: 172 px; opacity:0; filter:alpha(opacity=0);
The transform - origin: 95% 95%; - moz - transform - origin: 95% 95%; - ms - transform - origin: 95% 95%; - o - transform - origin: 95% 95%; - its - transform - origin: 95% 95%; The transform: scale (0.01);
Moz - transform: scale (0.01); - ms - transform: scale (0.01); - o - transform: scale (0.01); - its - transform: scale (0.01); transition:all 1s; Moz - the transition: all 1 s; - ms - the transition: all 1 s; - o - the transition: all 1 s; - its - the transition: all 1 s; }
/* the CSS Document returned to the top and the bottom right hand corner end */
Browser speed mode display is normal, the compatible mode is not shown in the bottom of the browser, but displays at the bottom of the page, how to solve the problem of compatibility, fixed at the bottom of the displayed in the browser,
As shown in figure:
CodePudding user response:
What companies want to use compatibility mode, use ie or chrome
CodePudding user response:
This article may help you,
https://blog.csdn.net/aoxiu2833/article/details/101582777
