bootstrap-sass 2.3.2 with rails 4.0.0:issue @extend .control-group; &安培; @extend .error;

时间:2014-05-13 10:58:04

标签: css ruby-on-rails twitter-bootstrap

我正在关注http://www.railstutorial.org/book/_single-page的rails 4.0.0教程。

我检查了所有内容以匹配教程,但似乎无法找到问题。

我的GemFile:

gem 'rails', '4.0.0'
gem 'bootstrap-sass', '2.3.2.0'

所有引导程序似乎都有效,但@extend的错误似乎不起作用。我知道bootstrap 2和3之间有区别。因此,我按照这一部分的教程来写信:)

我的custom.css.scss

#error_explanation {
  color:#f00;
  ul {
    list-style: none;
    margin: 0 0 18px 0;
  }
}

.field_with_errors {
  @extend .control-group;
  @extend .error;
 }

生成的HTML:

<...>
<div id="error_explanation">
    <div class="alert alert-error">
      The form contains 5 errors.
    </div>
    <ul>
      <li>* Name can&#39;t be blank</li>
      <li>* Email can&#39;t be blank</li>
      <li>* Email is invalid</li>
      <li>* Password can&#39;t be blank</li>
      <li>* Password is too short (minimum is 6 characters)</li>
    </ul>
</div>


      <div class="field_with_errors"><label for="user_name">Name</label></div>
      <div class="field_with_errors"><input id="user_name" name="user[name]" type="text" value="" /></div>

      <div class="field_with_errors"><label for="user_email">Email</label></div>
      <div class="field_with_errors"><input id="user_email" name="user[email]" type="text" value="" /></div>

      <div class="field_with_errors"><label for="user_password">Password</label></div>
      <div class="field_with_errors"><input id="user_password" name="user[password]" type="password" /></div>

<...>

enter image description here

enter image description here

1 个答案:

答案 0 :(得分:2)

愚蠢的我。当我开始这个项目时,我用脚手架生成了一些东西。完全忘了它。

如果您想摆脱脚手架,请按照说明操作:Getting rid of scaffold.css in rails