Adding CSS custom style failed in Rails

Question

im trying to add a custom CSS table alignment in my rails application. But it just doesnt seem to work. Can anyone help me please? Im new to web developing. Im learning HTML, CSS and Rails simultaneously. Here is my app/assessts/stylesheets/custom.css

td {
    vertical-align: middle;
}

And i've included style tag in my head tag. Here my app/views/layout/application.html.haml

!!!
%html
  %head
    %title
      = content_for?(:title) ? yield(:title) : "GentelellaOnRails"
    = stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true
    = stylesheet_link_tag 'custom'
    = javascript_include_tag 'application', 'data-turbolinks-track' => true
    = csrf_meta_tags
    %meta{:content => "width=device-width, initial-scale=1", :name => "viewport"}/
  %body.nav-md
    .container.body
      .main_container
        - flash.each do |key, value|
          #flash{:align => "center", :class => "alert alert-#{key}"}= value
        = render "partials/sidenav"
        = render "partials/topnav"
        .right_col{:role => "main"}
          = yield
        = render "partials/footer"
        = javascript_include_tag 'footermanifest', 'data-turbolinks-track' => true

And here's my index file :

%h1 Listing all patients

.x_panel
  .x_content
    = link_to 'New Patient', new_patient_path, class: "btn btn-primary"

    %table.table.table-bordered
      %thead
        %tr
          %th Id
          %th Image
          %th Name
          %th Email
          %th Address
          %th Phone
          %th Gender
          %th Birthdate
          %th Bloodgroup
          %th Options

      %tbody
        - @patients.each do |patient|
          %tr
            %td= patient.id
            %td= image_tag patient.image_url.to_s, :size => "100x80"
            %td= patient.name
            %td= patient.email
            %td= patient.address
            %td= patient.phone
            %td= patient.gender
            %td= patient.birthdate
            %td= patient.bloodgroup
            %td
              = link_to edit_patient_path(patient), class: "btn btn-warning" do  
                = fa_icon 'pencil'
              = link_to patient, :method => :delete, :data => { :confirm => 'Are you sure?' }, class: 'btn btn-danger' do 
                = fa_icon 'trash'

are you sure that your css is working? you can check it though using Inspect Element in chrome and check the alignments of needed elements — Hatik
– Hatik, Commented Jun 30, 2017 at 3:16

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

require custom.css in application.css eg

/assets/stylesheets/application.css

*= require custom
*= require_tree .

and remove line = stylesheet_link_tag 'custom' from layouts.

Restart your server.

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Jun 30, 2017 at 4:41

puneet18

4,4272 gold badges25 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Adding CSS custom style failed in Rails

1 Answer 1

/assets/stylesheets/application.css

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

/assets/stylesheets/application.css

Comments

Your Answer

Sign up or log in

Post as a guest

Related