类似问题:Respond.JS Not Working in IE 8
只担心IE8
我已经学会了response.js无法在本地工作,这是第一个问题。现在,我正在服务器上运行。而不是像Bootstrap 3那样鼓励和链接:
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
我正在做相对网址以避免访问问题。没有帮助。我还阅读了几个堆栈问题和其他评论媒体查询的Q&amp; A网站可能导致它崩溃。为了实现这一优点,我删除了CSS中的所有注释,但这没有任何帮助 - 没有注释掉媒体查询。
如果我取消了我的引导主题,我已设法阻止崩溃并让response.js工作。
我删除的项目,已清除缓存并已测试:
我不知道接下来会删除什么,除了删除整个CSS并一次添加一行...
这是我的CSS
/*****
Basic Styles
******/
img{
max-width: 100%;
}
.mobile-hide{
display: none;
}
body {
padding-bottom: 20px;
}
.navbar {
margin-bottom: 0px;
}
.bordered-box{
border: 2px solid #888;
padding: 8px ;
/* overflow: hidden; */
}
.border-left{
border-left:2px solid #888;
}
.no-side-margin{
margin-left: 0px;
margin-right:0px;
}
.rounded-corners{
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
.rounded-corners-bottom{
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
}
.rounded-corners-top{
-webkit-border-top-right-radius: 10px;
-webkit-border-top-left-radius: 10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-topleft: 10px;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
}
.col-sm-0{
width: 0px;
float: left;
overflow: hidden;
margin:0px;
padding: 0px;
min-height: 1px;
}
.padding-left{
padding-left: 6px;
}
.padding-top{
padding-top: 6px;
}
.padding-bottom{
padding-bottom: 20px;
}
.margin-top{
margin-top: 8px;
}
.margin-bottom{
margin-bottom: 20px;
}
img.padded-img{
padding: 10px;
}
.big-padding{
padding: 20px 0px;
}
.no-margin-bottom{
margin-bottom: 0px;
}
.no-margin-top{
margin-top: 0px;
}
h4.no-margin-bottom{
padding: 4px;
width: 100%;
}
.no-padding{
padding: 0px;
}
.no-border{
border: 0px;
}
.added-padding{
padding: 8px;
}
.smaller-font{
font-size: 10px;
}
.row input,
.bootstrap-select:not([class*="span"]):not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn){
width: 75%;
margin-bottom: 5px;
}
.full-inputs input , .full-inputs select{
width: 100%;
}
.row select{
width: 75%;
}
.row input[type=radio], .row input[type=checkbox]{
width: inherit;
}
.row input[type=radio], .row input[type=checkbox]{
max-width: 12px;
}
.rotate-clockwise{
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}
.fullwidth{
width: 100% !important;
}
.short-width{
width: 55px !important;
}
.no-hover:hover{
text-decoration: none;
}
.no-margin{
margin: 0px;
}
.no-bg{
background: inherit;
}
/*****
Colors
******/
.x-light-grey{
background: #f1f1f1;
color: #000;
}
.light-grey{
background: #ececec;
color: #888;
}
.light-grey-text{
color: #ececec;
}
hr.light-grey-text{
border-color:#dfdfdf;
}
.medium-grey{
background: #c6c4c4;
color: #000;
}
.medium-grey-text{
color:#c6c4c4;
}
.medium-grey-text a{
color:#c6c4c4;
text-decoration: underline;
}
input.medium-grey{
background: #c6c4c4;
}
.medium-dark-grey{
background: #6f6e6e;
}
.medium-dark-grey a{
color: #fff;
}
.medium-dark-grey a:hover{
color: #000;
text-decoration: none;
}
.medium-dark-grey:hover {
background: #c6c4c4;
}
.dark-grey{
background: #173746;
color: #fff;
}
.dark-grey-text{
color: #fff;
}
.black-text{
color: #000;
}
.white{
background: #fff;
color: #888;
}
.white-text{
color: #fff;
}
.yellow-text{
color: #e97e00;
}
.light-blue{
background: #4bb0e4;
color: #fff;
}
.light-blue-text{
color:#4bb0e4;
}
.medium-blue-text{
color: #428BCA;
}
.blue{
background: #232a58;
color: #fff;
}
.blue-text{
color: #232a58;
}
hr.blue{
border-color: #232a58;
}
.red-text{
color: red;
}
.medium-green{
background: #176c19;
}
.medium-green-text{
color: #176c19;
}
.medium-green a:hover{
color: #000;
text-decoration: none;
}
.medium-green:hover {
background: #c6c4c4;
}
.medium-green a, .medium-green{
color: #fff;
}
.grey-gradient{
background: #ededed;
background: -moz-linear-gradient(top, #ededed 0%, #f2f2f2 30%, #f8f8f8 46%, #f8f8f8 49%, #f6f6f6 49%, #f6f6f6 50%, #ffffff 78%, #ffffff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(30%,#f2f2f2), color-stop(46%,#f8f8f8), color-stop(49%,#f8f8f8), color-stop(49%,#f6f6f6), color-stop(50%,#f6f6f6), color-stop(78%,#ffffff), color-stop(100%,#ffffff));
background: -webkit-linear-gradient(top, #ededed 0%,#f2f2f2 30%,#f8f8f8 46%,#f8f8f8 49%,#f6f6f6 49%,#f6f6f6 50%,#ffffff 78%,#ffffff 100%);
background: -o-linear-gradient(top, #ededed 0%,#f2f2f2 30%,#f8f8f8 46%,#f8f8f8 49%,#f6f6f6 49%,#f6f6f6 50%,#ffffff 78%,#ffffff 100%);
background: -ms-linear-gradient(top, #ededed 0%,#f2f2f2 30%,#f8f8f8 46%,#f8f8f8 49%,#f6f6f6 49%,#f6f6f6 50%,#ffffff 78%,#ffffff 100%);
background: linear-gradient(to bottom, #ededed 0%,#f2f2f2 30%,#f8f8f8 46%,#f8f8f8 49%,#f6f6f6 49%,#f6f6f6 50%,#ffffff 78%,#ffffff 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#ffffff',GradientType=0 );
}
/*****
Header
******/
.padded{
padding-top: 15px;
}
/*****
Arrows
******/
.arrow_box {
position: relative;
padding:5px 15px;
height: 30px;
}
.arrow_box_blue{
background: #112346;
color: #fff;
z-index: 100;
}
.arrow_box_blue:after {
left: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(17, 35, 70, 0);
border-left-color: #112346;
border-width: 13px;
margin-top: -12px;
}
.arrow_box_blue:before {
left: 0%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(255,255,255,0);
border-left-color: #ececec;
border-width: 13px;
margin-top: -12px;
}
.arrow_box_grey{
background: #ececec;
color: #888;
font-size: 10px;
line-height: 20px;
}
.arrow_box_grey:after {
left: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(17, 35, 70, 0);
border-left-color: #ececec;
border-width: 13px;
margin-top: -12px;
}
.arrow_box_grey:before {
left: 0%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(255,255,255,0);
border-left-color: #ececec;
border-width: 13px;
margin-top: -12px;
}
.arrow_box:first-child:before{
border: none;
}
/*****
Sidebar
******/
#sidebar h2{
font-size: 18px;
padding: 4px;
margin-bottom:0px;
margin-top:32px;
}
#sidebar ul{
margin-left:0px;
padding:0px;
}
#sidebar li{
list-style-type: none;
padding: 20px 10px;
font-size:12px;
}
#sidebar a{
color: #000;
}
#sidebar .active a{
color: #fff;
}
#sidebar .active:after{
}
#sidebar{
overflow: hidden;
}
.sidebar-nav a:hover{
text-decoration: none;
}
.sidebar-nav a:hover li{
background: #4bb0e4;
color: #fff;
}
.sidebar-nav a:hover li.light-blue{
background: #c6c4c4;
color: #fff;
}
.toggle-btn{
margin-top: 5px;
}
.toggle-btn .glyphicon{
padding-right:6px;
padding-left:6px;
}
.toggle-btn a:hover{
text-decoration: none;
}
a#toggler-hide{
color: #fff;
}
a#toggler-show,a#summary-show,a#summary-hide, .btn-padding{
padding: 4px;
}
a#summary-show .glyphicon{
padding-right:3px;
}
.filter-section{
margin-bottom: 20px;
border-bottom: 4px solid #888;
}
#filters input{
width: inherit;
}
/*****
Home Page Dashboard
******/
.bordered-box h4.dark-grey{
}
/*****
Summary Floater
******/
.row{
position: relative;
}
#summary-info{
position: absolute;
right: 0;
z-index: 101;
background: rgba(255,255,255,0.89);
}
.summary-box{
padding: 0px;
margin: 10px 0px;
}
.summary-box h5{
margin-top: 0px;
padding:5px 0px 2px 4px;
}
.summary-box h6{
font-size: 14px;
padding: 4px 6px 10px;
}
.summary-box p{
font-size: 12px;
padding: 1px 8px;
margin: 0px;
}
.summary-box hr{
margin: 2px 10px;
border-color: #888;
}
p.text-indent{
padding:1px 14px;
}
#asset-btn{
max-width: 200px;
padding: 5px 0px 5px 5px;
}
.summary-box .light-grey{
padding-bottom: 15px;
}
.summary-box .row{
padding: 0px 6px;
font-size: 12px;
}
/*****
Company/Account Information
******/
#company-header h3, .section-title{
margin-top: 0px;
}
#company-header input{
width: 90%;
}
/* Tabs */
.request-buyout{
margin: 5px 0px;
}
#tab-area{
max-height: 350px;
overflow: scroll;
margin-top:30px;
margin-bottom: 30px;
border-bottom:3px solid #888;
}
#tab-area .nav-tabs>li{
background: #ccc;
border-radius: 4px 4px 0 0;
}
#tab-area .nav-tabs>li a{
color: #000;
}
.table th{
}
.table th a{
color: #fff;
}
/* FAQS */
#faqs h5{
font-weight: 600;
padding: 6px;
margin-top:0px;
}
#faqs .panel-title{
font-size: 14px;
}
#faqs .panel-default>.panel-heading+.panel-collapse .panel-body{
font-size: 12px;
}
.faqs-list{
list-style-type: none;
padding-left:0px;
text-indent: 20px;
}
.faqs-list li{
padding: 6px 0px;
}
.faqs-list li:hover{
background-color: #173746;
color: #fff;
}
/* Change Address Pages */
.table-responsive{
max-height: 300px;
overflow: scroll;
}
/*Contract && Asset Profile */
.download-img{
max-width: 55px;
}
.back-button .glyphicon{
top:2px;
}
.back-button h3{
margin: 0px;
padding: 10px 0px;
font-size: 20px;
}
/* Tool Tips */
.tool-tip{
/* font-size: 20px; */
}
/*****
Payments
******/
/*****
FAQs
******/
.canon-faqs .panel-default{
border: none;
}
.canon-faqs .panel-default>.panel-heading{
background-color: #fff;
}
.canon-faqs .panel{
-webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, 0.05);
box-shadow: 0 0px 0px rgba(0, 0, 0, 0.05);
border-radius: 0px;
border-bottom:1px solid #000;
}
.canon-faqs .glyphicon{
color: #232A58;
padding: 4px;
margin-right:8px;
background: #e0e0e8;
}
h3.canon-faqs{
padding-bottom: 4px;
border-bottom: 1px solid #000;
}
/*****
Footer
******/
footer{
padding-bottom: 70px;
font-size:12px;
}
footer, footer a, footer a:visited{
color: #fff;
}
footer a:hover, footer a:active{
color: #ccc;
}
footer h4{
border-bottom: 1px solid rgba(204,204,204,0.52);
}
footer ul{
margin-left:0px;
padding-left:0px;
}
footer li{
list-style-type: none;
}
.corporate-menu{
margin-top:26px;
}
/*****
Navigation
******/
/* Logo area */
.navbar-default{
background: #fff;
}
.navbar-default .navbar-brand{
padding-top: 20px;
}
a#logo-banner span {
background-image: url(../assets/branding/head.jpg);
background-position: left center;
background-repeat: no-repeat;
padding: 10px 122px 0px;
}
.navbar-default .navbar-nav>li>a , footer a, div, .toggle-btn a, .nav-tabs>li{
-webkit-transition: all 500ms ease-in-out 0s;
-moz-transition: all 500ms ease-in-out 0s;
-o-transition: all 500ms ease-in-out 0s;
transition: all 500ms ease-in-out 0s;
}
span, .fast-animation{
-webkit-transition: all 100ms ease-in-out;
-moz-transition: all 100ms ease-in-out;
-o-transition: all 100ms ease-in-out;
transition: all 100ms ease-in-out;
}
.no-animation{
-webkit-transition: all 0ms ease-in-out;
-moz-transition: all 0ms ease-in-out;
-o-transition: all 0ms ease-in-out;
transition: all 0ms ease-in-out;
}
.alpha-out{
opacity: 0;
}
.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus{
color: #d10801;
}
.navbar-default .navbar-nav>li>a{
border-bottom: 4px solid #fff;
}
.nav .open>a, .nav .open>a:hover, .nav .open>a:focus{
border-color:#d10801
}
.dropdown-menu>.active>a, .dropdown-menu>.active>a:hover, .dropdown-menu>.active>a:focus{
background: #d10801;
}
/* Desktop Menu */
.navbar{
border-color: #173746;
border-width: 0px 0px 3px;
}
#logo-banner{
max-width: 100px;
}
.navbar-nav>li>a:after {
content: '';
position: absolute;
left: 100%;
bottom: 20%;
height: 50%;
border-right: 1px solid #ececec;
}
.navbar-nav li:last-child a:after{
display: none;
}
/* Active Link */
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus{
background-color: inherit;
border-bottom: 4px solid #d10801;
color: #d10801;
}
/* Mobile Menu */
.navbar-collapse .pull-right{
width: 100%;
margin: 0;
}
/*****
Media Queries
******/
@media (min-width: 768px){
.navbar{
border: none;
max-width: inherit;
}
.navbar-nav>li>a{
padding: 8px;
padding-top:35px;
padding-bottom:35px;
}
.mobile-hide{
display: block;
}
.navbar-collapse .pull-right{
width: inherit;
}
a#logo-banner span {
background-image: url(../assets/branding/CanonFinancialServices_HEX_CC0000_LG.gif);
background-size: 100px;
padding: 15px 55px 0px;
}
.navbar>.container .navbar-brand{
margin-top:25px;
}
.corporate-menu{
border-top:1px solid rgba(204,204,204,0.52);
}
#logo-banner{
max-width: inherit;
}
}
@media (min-width: 992px){
.navbar-default .navbar-nav>li>a{
font-size:16px;
}
a#logo-banner span {
background-size: 140px;
}
footer h4{
font-size: 15px;
}
}
@media (min-width: 1200px){
.corporate-menu{
border-top:none;
border-left:1px solid rgba(204,204,204,0.52);
}
}
答案 0 :(得分:1)
无法解释原因,但溢出:滚动是问题。
.table-responsive{
max-height: 300px;
overflow: scroll;
}