我没有在我的Rails应用程序的bootstrap模式中应用CSS

Question

以下是我的引导程序设置：

Rails ver：4.1.1

的Gemfile：

  gem 'bootstrap-sass', '~> 3.2.0'
  gem 'bootstrap3-datetimepicker-rails', '~> 3.0.2'
  gem 'bootstrap-validator-rails'

Application.css.scss（前3个导入，没有require指令）

   @import "bootstrap-sprockets";
   @import "bootstrap";
   @import "bootstrap-datetimepicker";

的application.js

//= require jquery
//= require jquery.flexslider
//= require jquery.turbolinks
//= require jquery_ujs
//= require jquery-ui/autocomplete
//= require ./plugins/bootstrap-select.js
//= require ./plugins/jquery.form.js
//= require bootstrap-datetimepicker
//= require bootstrapValidator.min
//= require bootstrap-sprockets
//= require_tree .

模态HTML：

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">x</span><span class="sr-only">Close</span></button>
      <h4 class="modal-title" id="myModalLabel"> Title </h4>
    </div>
    <div class="modal-body">
       <%= render partial: 'modal_body' %>
    </div>
    <div class="modal-footer">      
      <button type="button" class="btn btn-primary">Mark</button>
    </div>
  </div>
</div>
</div>

我能够渲染模态，但模态占据了窗口的整个宽度。

Answer 1

而不是Application.css.scss，

将您的文件重命名为Application.scss。

mv Application.css.scss Application.scss