0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Ruby on Rails で特定のViewにCSS を適用する

Last updated at Posted at 2020-10-17

Ruby on Rails で作ったWebアプリケーションのあるページで、Tableタグで作った表中の文字が上揃えになっていました。
このままでは見た目が悪いので、上下中央揃えとなるよう、CSSを適用する方法を調べましたので自分用メモとして残します。

1.何を修正すれば良いのか?

/marketpurser(私が作ったアプリ名です)/app/assets/stylesheets 内のファイルです。
デフォルトで存在するapplication.scss に追記すると、すべてのViewに適用されます。
また、Viewの名前に対応した.scssファイルに追記すると、特定のViewのみに適用されます。

2.どう記述すれば良いのか?

CSSと同じ文法で良いです。
今回はtableクラスを持ったtableタグ内の、tdタグに適用したいので、以下のように記述しました。

/marketpurser/app/assets/stylesheetssample.scss
table.table td {
 vertical-align:middle;
}
sample.html.erb
<table class="table">
  <thead>
    <tr>
      <th>#</th>
      <th>Info</th>
    </tr>
   </thead>
   <tbody id="myTable">
    <tr>
      <td>1</td>
      <td>data1</td>
    </td>
   </tbody>
</table>

解決しました。
なお、単にブラウザを再読み込みするのではなく、もう一度修正したViewのページにアクセスしないとCSSが反映されませんでした。(初歩的なミス)

以上、個人的なメモでした。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?