Question

New to rails. Trying to add a background with css to the loop area of my code but it seems to not read in the area. Any css applied before or after the rails loop function is shown but the background stops right before everything in the museum.each do loop. Any help?

scaffold.css.css:

#museums {
    background: #ccc;
}

index:

<div id="museums">
<h1> Museums </h1>
<% @museums.each do |museum| %>
    <div class="museumAdd">
        <div class="name"><%= museum.name %></div>
        <div class="description"><%= museum.description %></div>
        <div class="location"><%= museum.city %>, 
        <%= museum.state %></div><br />

        <div class="edit">
            <%= link_to 'View', museum %><br />
            <%= link_to 'Edit', edit_museum_path(museum) %><br />
            <%= link_to 'Delete', museum, :confirm => 'Are you sure?', :method => :delete %>
        </div>
    </div>
<% end %>
</div>

Answer 1

You have not provided enough information to answer the question with certainty, and I don’t have enough karma/circus points/whatever to ask questions as a comment yet.

Oh well, I do have a pretty good guess though. This is not a Rails problem. You could be using anything back there. This is a CSS problem. From the comments under your question, it sure sounds like a classic “container not enclosing its floats” issue, even though I cannot ask you if the things inside #museum are floated. Are they? Adding a set height fits the classic symptoms.

There are about a gazillion different float-clearing and -enclosing techniques out there. Assuming you do NOT have a height set on your div now, a quick way to check is, does the problem go away if you give #museums overflow: hidden?

Overflow:hidden is not always the best float-enclosing method but it’s good 90+% of the time. Try it and report back.