Loop in Rails view without line breaks - ruby-on-rails

Question

I want to loop through an array of things and create a tab for each one. When I pull up the page, however, each one appears on a new line. I'm using Slim, though I think this would translate to any other tempting language.
I also have a reset.css loaded before anything else, but the breaks remain.
Slim:
p Your dashboard!
.tabs
.tab-bar
- TYPES.each do |type|
.tab-item
p
= type.to_s
Scss:
.tabs {
width: 80%;
border-color: $slushie;
.tab-bar {
.tab-item{
p {
color: $white;
font-weight: bold;
font-family: Helvetica;
}
}
}
}

Answer 1

You need to add a float:left; element onto the css element
tabs {
float:left;
width: 80%;
border-color: $slushie;
.tab-bar {
.tab-item{
p {
color: $white;
font-weight: bold;
font-family: Helvetica;
}
}
}
}

Answer 2

It's probably because you're using a p element which is normally a block element. You can override this using something like display: inline; (not that you will need to do this on your .tab-item div too). You could also float the .tab-item elements instead.
.tabs {
width: 80%;
border-color: $slushie;
.tab-bar {
.tab-item{
display: inline;
p {
color: $white;
font-weight: bold;
font-family: Helvetica;
display: inline;
}
}
}
}