full width responsive image with image tag in Rails 4 app

Im using the code below to make header images appear randomly in a app I´m making. I want the images to span the whole width of the screen but somehow it is not working.

the image size is width 1200px X height360px

I've added this line style: 'height:auto;width:100%;' to the image tag, hoping it would make the image fill the width of the screen, but it didn't do the trick.

I'm feeling kind of lost here, am I missing something? or am I just totally in the dark?

in my categories/show.html.erb I have this code

<header id="necklace_header" class="img-responsive">

  <img src="/assets/rand_headers/<%= @random_image%>", style: 'height:auto;width:100%;' >
    <h1>
      <%= @category.name %>
    </h1>
</header>

In categories_controller.rb I have

 def show
     @products = @category.products
     @images  = ["1.jpg", "2.jpg", "3.jpg", "4.jpg", "5.jpg"]
     @random_no = rand(5)
     @random_image = @images[@random_no]
  end

then in the categories.scss I have this code

#necklace_header {
    width: 100%;
    background-repeat:no-repeat;
    background-position: top center;

    background-size: cover;  

    height: 360px;
    margin-bottom: 20px; 

}

thanks in advance, any help would be appreciated