rails　scssが反映されません

railsでwebアプリを作成中です。
cssは反映されるのですが、scssが反映されません。

@import 'welcome.scss';　や
*= require_tree .
*= require_self
の記載があるか等調べて試してみたのですが解決できませんでした。
ご教授いただけないでしょうか。

rails　5.2.4
ruby 2.6.2
dockerを用いて開発しています。

welcome.scss


#welcome-index {
  .content-wrapper{
      display: flex;
      
    .content-block{
      background-color: blueviolet;
      width: 80%;
      height: 200px;
    }
    .sidebar{
      background-color: cornflowerblue;
      width: 20%;
      height: 200px;
    }
  }
}

application.css.scss

@import 'welcome';

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .
 *= require_self
 */

 #header {
  display: flex;
  align-items: center;
  justify-content: space-between;
 }

 #header #nav {
  list-style: none;
  display: flex;
}


 
#header #nav li {
  width: 140px;
  text-align: center;
  background-color: #333;
  height: 50px;
  line-height: 50px;
  margin-right: 2px;
}
 
#header #nav li a {
  text-decoration: none;
  color: #fff;
  font-weight: bold;
  padding: 20px;
}

#footer {
  background-color: #333;
  color: #fff;
  text-align: center;
  padding: 10px 0px;
  font-size: 13px;
  margin-top: 20px;
}

#footer p {
  margin: 0px;
}

行動規範の内容に同意します

回答2件

自己解決

body　id　と全角のスペースがあった為反映されませんでした。
今後は拡張ツール導入で対策します。

投稿2021/05/09 02:54

gsbzn_

総合スコア4

Htmlからは呼び出していますか？

application.html.erbからも呼び出しておかないとと反映されませんよ。

投稿2021/04/19 09:37

yaha4967

総合スコア106

gsbzn_

2021/04/19 13:31

ご回答ありがとうございます。 application.html.erbにも＠importを記載するということでしょうか。他に https://qiita.com/Y_ASAMOTO/items/d5f33ecf5bfbb7f028a5 こちらのSassを使用する準備をするという項目の箇所を試してみましたが改善されませんでした。