CSS Text word break With overflow

Question

Hey I want To make my text to break word and get only the first break word like make the the second break word and the rest to be hidden.

This is the site for the code: here

This is the part i want to be edit. ignore the other code in the jsfiddle.

.rpwe-block a{
color:#9d6745;
text-decoration:none;
clear: both;
text-overflow:ellipsis;
 overflow: hidden; white-space: nowrap;
}

I just want you to help me in editing this code I have.

Answer 1

For the overflow: hidden to work the element would need a width (by default a tags are inline elements)

.rpwe-block a{
color:#9d6745;
text-decoration:none;
clear: both;
text-overflow:ellipsis;
overflow: hidden; white-space: nowrap;
width: 100%;
display: block;
}

Answer 2

Get rid of white-space: no-wrap from .rpwe-block a and add the following:

.rpwe-title{
  height: 14px;
  display: block;
  overflow: hidden;
}