Rails - Inline CSS

So I'm making a user profile page for my app. However I want the user's avatar to have an inset white box-shadow. Therefore using <img /> isn't an option since it doesn't开发者_StackOverflow support inset shadows (or at least not in Chrome). So instead I'm using a <div> with some inline css to set the image. Here's kinda what I want but of course it wont work.

<div id="avatar" style="background: <%= @person.avatar %>"></div>

Can anyone point me in the right direction for doing this?

Is avatar the actual URL of the image? In that case:

<div id="avatar" style="background-image: url('<%= current_person.avatar %>')"></div>

Make sure that the width and height match the image dimensions in the CSS.

This should work pretty well

<div id="avatar" style="background:url(<%= current_person.avatar %>) no-repeat;" width="<%= User.AVATAR_WIDTH %>" height="<%= User.AVATAR_HEIGHT %>"></div>

User.AVATAR_WIDTH and User.AVATAR_HEIGHT should be defined in your app/models/user.rb as something like:

class User
  AVATAR_WIDTH = 250
  AVATAR_HEIGHT = 250
end