enter image description here我的引导站点(引导3)在chrome / edge / opera上运行正常,但是在firefox网格布局上加载得很好,然后一秒钟都坏了吗?
<!-- Main content -->
<section class="content">
****Main row****
<div class="row">
<div class="col-lg-4 col-md-4" style="overflow:hidden;">
<div class="col">
<!-- members -->
<div class="info-box red-bg">
<div class="info-box-content">
<span class="info-box-text"><strong>Total Members</strong></span>
<span class="info-box-number text-white"><?php echo count($clients); ?></span>
<hr>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
<!-- /.info-box -->
<div class="info-box orange-bg">
<div class="info-box-content">
<span class="info-box-text"><strong>Active Members</strong></span>
<span class="info-box-number text-white"><?php echo count($clients)-2; ?></span>
<hr>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
<!-- /.info-box -->
<div class="info-box yellow-bg">
<div class="info-box-content">
<span class="info-box-text"><strong>Inactive Members</strong></span>
<span class="info-box-number text-white">2</span>
<hr>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
<!-- ./members -->
</div>
</div>
<div class="col-lg-8 col-md-8" style="overflow:hidden;">
<div class="col">
<!-- Subscriptions -->
<div class="box border-two">
<div class="box-header" style="color:white; background-color: #b2b2b2;">
<h3 class="box-title">Subscriptions to Expire</h3>
</div>
<!-- /.box-header -->
<div class="box-body table-responsive">
<table id="subscriptions" class="table table-bordered table-striped">
<thead style="color:#9e9e9e; background-color:#ffffff;">
<tr>
<th>Full Name</th>
<th>Package</th>
<th>Expiry in</th>
<th>Mail a Notification</th><!--new-->
<th>View Profile</th><!--new-->
</tr>
</thead>
<tbody>
<?php foreach ($clients as $c): ?>
<tr>
<td><?php echo $c->first_name.' '.$c->last_name; ?></td>
<td>Package 01</td>
<td>4 days</td>
<td><a href="<?php echo base_url(); ?>welcome/viewProfile/<?php echo $c->id; ?>"><img class="img-responsive" width="30" style="margin-left:60px;" src="<?php echo base_url()?>assets/dist/img/send.png"/></a></td><!--new-->
<td><a href="<?php echo base_url(); ?>welcome/viewProfile/<?php echo $c->id; ?>"><img class="img-circle" width="30" style="margin-left:30px;" src="<?php echo base_url()?>assets/dist/img/table-profile.png"/></a></td><!--new-->
</tr>
<?php endforeach ?>
</tbody>
</table>
</div>
<!-- /.box-body -->
</div>
<!-- ./Subscriptions -->
</div>
</div>
<!--SALES GRAPH AND UPCOMMING COURSES-->
<div class="col-lg-7" style="overflow:hidden;">
<!-- Left col -->
<section class="col connectedSortable">
<!-- Custom tabs (Charts with tabs)-->
<!-- solid sales graph -->
<div class="box box-solid dark-gray-bg">
<div class="box-header">
<i class="fa fa-th"></i>
<h3 class="box-title">Sales Graph</h3>
<div class="box-tools pull-right">
<button type="button" class="btn dark-gray-bg btn-sm" data-widget="collapse"><i class="fa fa-minus"></i>
</button>
<button type="button" class="btn dark-gray-bg btn-sm" data-widget="remove"><i class="fa fa-times"></i>
</button>
</div>
</div>
<div class="box-body border-radius-none">
<div class="chart active" id="line-chart" style="height: 250px;">
<div class="chart " id="revenue-chart" style="position: relative; height: 300px;"></div>
<!-- <div class="chart tab-pane" id="sales-chart" style="position: relative; height: 300px;"></div> -->
</div>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
<!-- /.nav-tabs-custom -->
</section>
<section class="col connectedSortable" style="overflow:hidden; background-color:#b3b3b3; padding:0;">
<div class="box box-solid" style="background-color:#b3b3b3;" >
<div class="box-header">
<!--<i class="fa fa-th"></i>-->
<h3 class="box-title">UPCOMING COURSES</h3>
<div class="box-tools pull-right">
<!-- OLD BUTTONS -->
</div>
</div>
<?php for ($i=0; $i < 6; $i++) { ?>
<!-- event 1 -->
<div class="" style="width:100%;">
<div class="col-lg-4 col-md-6 col-sm-12 media" style="padding-bottom:20px;">
<div class="training-box" style="padding-left:15px;">
<h2 class="text-white text-uppercase course-type">Crossfit</h2>
<p class="text-white text-uppercase date mb-0">15 jan 2018</p>
<p class="text-white time mb-0">19:00</p>
<p class="text-white spaces-left mb-0">12 spaces left</p>
<div class="training-box-span">
<span><a href="#" onclick="alert('Cancel')" >x</a></span>
<span><a href="#" onclick="alert('Delete')"><i class="fa fa-trash-o"></i></a></span>
</div>
</div>
</div>
</div>
<div class="" style="width:20;"><!--emptyyy--></div>
<!-- / event 1 -->
<?php } ?>
</div>
</section>
</div>
<!--NEW CLIENTS AND SEND MAIL TO OUR CLIENTS -->
<div class="col-lg-5">
<section class="col connectedSortable">
<!-- /.info-box -->
<!-- USERS LIST -->
<div class="box border-two new-clients">
<div class="box-header with-border">
<h3 class="box-title">New Clients</h3>
</div>
<!-- /.box-header -->
<div class="box-body no-padding">
<ul class="users-list clearfix">
<?php foreach ($newest as $new): ?>
<li class="col-xs-12 col-sm-4 col-md-4 col-lg-4">
<?php if ($new->picture_url == ""): ?>
<img class="img-responsive" src="https://i0.wp.com/www.calvary.edu/wp-content/uploads/2016/08/person-placeholder.jpg" alt="User Image">
<?php else: ?>
<img class="img-responsive" src="<?php echo $new->picture_url; ?>" alt="User Image">
<?php endif ?>
<!-- <a title="<?php echo $new->first_name.' '.$new->last_name; ?>" class="users-list-name" href="<?php echo base_url(); ?>welcome/viewProfile/<?php echo $new->id; ?>"><?php echo $new->first_name.' '.$new->last_name; ?></a> -->
<!-- <span class="users-list-date"></span> -->
</li>
<?php endforeach ?>
</ul>
<!-- /.users-list -->
</div>
<!-- /.box-body -->
<!-- /.box-footer -->
</div>
<!--/.box -->
</section>
<!-- right col -->
<!-- /.row (main row) -->
<!--SEND AN EMAIL TO OUR CLIENTS-->
<section class="col connectedSortable mt-5">
<div class="box box-solid " style="background-color: #e62249;">
<div class="box-header">
<i class="fa fa-th" style="visibility: hidden;"></i>
<h3 class="box-title"></h3>
<div class="box-tools pull-right">
<!-- OLD BUTTONS -->
</div>
</div>
<div id="redBoxDashboard" class="box-body border-radius-none" onclick="location.href = '<?php echo base_url(); ?>welcome/compose'; ">
<div class="col-md-12" style="color: white;">
<img src="<?php echo base_url()?>assets/dist/img/send-mail-white.png" alt="Send Mail" />
<h4 style="font-weight: bolder;">SEND AN EMAIL TO YOUR CLIENTS</h4>
</div>
</div>
</div>
</section>
</div>
</div>
</section>
这是代码,如果您不看php代码,这是非常基本的网格布局。 两部分:左一较大,右一较小
答案 0 :(得分:0)
已解决:)
Admin LTE主题(引导主题)肯定存在问题 我使用仅在mozzilla浏览器上有效的规则,并通过媒体查询手动解决了该问题!
@-moz-document url-prefix() {
@media only screen and (min-width: 980px) and (max-width: 1199px) {
.box {
width: 60%!important;
}
}
}