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.