I'm new to Twitter Bootstrap. I wrote following HTML:

<div class="span4">
   <span class="row-fluid hideOverflow">
   @Html.ActionLink(item.Name, "Details", new { id = item.Id }, new { @class = "JumpLinks", @style = "font-size:13px;font-weight:bold;" })
   </span>
</div>

The CSS for the hideOverflow class is:

.hideOverflow
{
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

But it is showing me result as: enter image description here

Then I changed 'row-fluid' to span12 and then it is showing the following result:

enter image description here

Why is my hideOverFlow class not working with the row-fluid class?

What do I need to change in order to get the same result as the row-fluid class?

Edit
Report