Question

我正在使用yii2 basic。

我已经安装了Admin LTE并且正在运行。

现在我有员工CRUD。当管理员查看特定员工的视图时，详细信息将从屏幕上水平移出，即没有水平滚动条可以滚动页面以完全查看详细信息。

如何做到这一点？

Answer 1

我与AdminLTE有同样的问题。我通过覆盖容器流体的css解决了这个问题。 .container-fluid { overflow-x: scroll; }的课程。以下是一般示例：

  <html>
    <head>
      <style>
        .container-fluid {
          overflow-x: scroll;
        }
      </style>
    </head>
    <body class="skin-black sidebar-mini" role="document">
      <div class="wrapper">

        <!-- AdminLTE Main Header here -->

        <!-- AdminLTE Sidebar here -->

        <!-- Content Wrapper. Contains page content -->

        <div class="content-wrapper">
          <section class="content-header">
            <h1>View Employees Header Page</h1>
            <ol class="breadcrumb">
              <li><a href="#">Home</a></li>
              <li class="active">Employees</li>
            </ol>
          </section>
          <section class="content container-fluid">

            <!-- Employees table view with horizontal scrollbar -->

          </section>
        </div>

        <!-- /.content-wrapper -->

        <!-- AdminLTE Footer here -->
      </div>
    </body>
  </html>

Answer 2

如果要启用水平滚动条而不是某个div，则必须从adminlte.js中删除以下代码

并将之前的所有div设置为width：100％;

Layout.prototype.fix = function () {
// Remove overflow from .wrapper if layout-boxed exists
$(Selector.layoutBoxed + ' > ' + Selector.wrapper).css('overflow', 'hidden');

// Get window height and the wrapper height
var footerHeight  = $(Selector.mainFooter).outerHeight() || 0;
var neg           = $(Selector.mainHeader).outerHeight() + footerHeight;
var windowHeight  = $(window).height();
var sidebarHeight = $(Selector.sidebar).height() || 0;

// Set the min-height of the content and sidebar based on
// the height of the document.
if ($('body').hasClass(ClassName.fixed)) {
  $(Selector.contentWrapper).css('min-height', windowHeight - footerHeight);
} else {
  var postSetHeight;

  if (windowHeight >= sidebarHeight) {
    $(Selector.contentWrapper).css('min-height', windowHeight - neg);
    postSetHeight = windowHeight - neg;
  } else {
    $(Selector.contentWrapper).css('min-height', sidebarHeight);
    postSetHeight = sidebarHeight;
  }

  // Fix for the control sidebar height
  var $controlSidebar = $(Selector.controlSidebar);
  if (typeof $controlSidebar !== 'undefined') {
    if ($controlSidebar.height() > postSetHeight)
      $(Selector.contentWrapper).css('min-height', $controlSidebar.height());
  }
}

};

Answer 3

添加以下内容：

from util import db

默认情况下，考虑您的yii2网格视图类<style> .grid-view { overflow: auto; } </style>;

如何在yii2中的Admin LTE中创建水平滚动条？

3 个答案: