Question

我已经阅读并实现了很多这个问题的解决方案，因为它似乎是一种非常常见的令人沮丧的体验。我将两个引导列设置为100％，因为我希望它们填充页面上的可用空间，但不是填充主体，而是填充html元素...比主体大。如果我没有将这些列设置为100％，那么就没有明显的问题，如果我这样做，我就看不到溢出，那么一切都接近完美......但这显然是一个不好的做法。我的基本布局是这个（它在HAML中）：

%head
  %meta stuff
  = csrf_meta_tag
%body#dashboard
  = yield 
%footer.clearfix.dashboard-footer
  .aaux.footer-links
    %a stuff
= javascript_include_tag "application"

我的部分页面如下所示：

.clearfix.tabs
  = link_to "View All", dashboard_patients_path, class: "active", method: :get
  = link_to "Add Patient", dashboard_patients_add_path, method: :get
.col-xs-12.col-sm-12.col-md-8.col-lg-8.left-side
  .row
    .clearfix.title Something
    .table-responsive
      %table.table.table-striped
        %thead
          %tr
            %td stuff
        %tbody
          - @stuff.each do |stuff|
            %tr
              - simple logic
              %td stuff
    .clearfix.buttons-div
      = paginate @variable
.col-xs-12.col-sm-12.col-md-4.col-lg-4.right-side

我的相关CSS（减去引导程序的东西）是

html
  padding: 0 0 0 0
  margin: 0 0 0 0

body
  background-color: #000000
  background-image: image-url("bg.png")
  background-repeat:  no-repeat
  background-size: cover
  position: relative
  min-height: 69em
  height: 100vh
  padding: 0 0 0 0
  margin: 0 0 0 0



.left-side
    min-height: 600px
    position: relative
    .title
      margin: 30px 0 20px 5%
      font-size: 35px
      font-family: 'aaux'
      color: #84878C
    .table
      border: 1px solid #BBBBBB
      font-size: 27px
      font-family: 'aaux'
      color: #84878C
      margin: 0 5% 70px
      width: 90%
      thead
        background: #BECAD9
      tbody td
        border: 0
        background: #FAFAFA

我很感激所有的建议;我仍在努力解决Stackoverflow上类似问题的无数解决方案，但是当我第三个小时出现时，我认为是时候要求对我的具体情况有所了解。

Bootstrap网格：大于身体的HTML元素@ 100％

0 个答案: