Home/ Questions/Q 8249039
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-07T23:23:58+00:00

What’s the best way to achieve something like this in a Ruby on Rails

  • 0

What’s the best way to achieve something like this in a Ruby on Rails view with CSS:

This is what I have now:

List Item 1 – is not too long enter image description here enter image description here
List Item 2 – very,very long and I don’t want the “column” to be this large; I want it to wrap enter image description here enter image description here
List Item 3 – hello enter image description here enter image description here

This is what I want:
enter image description here

The List Items come from a Solution class; the thumbs up/down are votes that come from a Solution_votes class.

Ideally, I would use a table with 3 columns, however, I am also using Axaj and JQuery to update and want to use an unordered list (to easily update using $(‘#items_list’).prepend(new_item);).

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    HTML:

    <ul class="entries">
  <li>
    <span class="title">List Item 1 - is not too long</span>
    <a class="thumb down">0 Votes Down</a>
    <a class="thumb up">0 Votes Up</a><!-- float:right will place this to the left -->
  </li>
  ...
</ul>

    CSS:

    ul.entries { list-style: none; }
ul.entries li {
  margin: 10px 0;
  border: 2px solid black;
  border-radius: 6px;
  width: 600px;
}
ul.entries .title {
  float: left;
  width: 380px;
}
ul.entries .thumb {
  float: right;
  margin-left: 20px;
  width: 90px;
  /* todo: color, background + padding-left declarations for thumb icons */
}
    • 0