Unable to use @extend from bootstrap-sass gem in my Layout file

Question

Layout.css file :-

body {
  padding-top: 20px;
}

#flash_notice {
  @extend .alert;
  @extend .alert_success;
}
#flash_error, #flash_alert {
  @extend .alert;
  @extend .alert-danger;
}
#flash_warning {
  @extend .alert;
  @extend .alert-warning;
}

application.css.scss :-

@import "bootstrap-sprockets";
@import "bootstrap";
@import "layout";

Gemfile :-

gem 'sass-rails', '~> 4.0.3'
gem 'bootstrap-sass', '3.3.1'

When i am looking in my souce file in browser (/assets/application.css?body=1) i am unable to find css style added by @extend call

Answer 1

@extend is a sass concept, and your file is named .css not .scss or .scss.css . I'm guessing that the Sass compiler is doing nothing with your content, just combining it for the master application.css .