[Hỏi đáp] Chỉnh giúp em cái chủ để trong topics_list_box

tình hình là các chủ đề của em trong topics_list_box nó dài wá , nó xuống dòng , em muốn làm sao cho các chủ đề trong topics_list_box nó ngắn lại , mà mỏi lần để chuột vô chủ đề nào là nó hiện hết chủ đề ra lun , còn hok để là nó tự ngắn lại giúp mình , hok pk ở devs có ai biết code đó hok nữa

demo : http://www.xshop.cf/f9-forum

chèn vào view forum body

Code:

<style>a.topictitle {
display: block;
white-space: nowrap;
overflow: hidden;
width: 95%;
text-overflow: ellipsis;
}
a.topictitle:hover {
display: inline;
white-space: normal;
text-shadow: none;
}</style>

Chủ đề nó xuống dòng , giúp em vvới

sửa trong đoạn css lúc nãy mình đưa , sửa display: block;thành display: inline-block;

@ligerv Vẫn không dc anh àk .

Code:

<style>a.topictitle {
display: inline
white-space: normal;
overflow: hidden;
width: 95%;
text-overflow: ellipsis;
}
</style>

Sửa cái white-space: nowrap; thành white-space: normal; và sửa thành display: inline như trên là được.

Đơn giản:
trong a.topictitle , sửa width: 95%; thành width: 85%; hoặc số tùy thích
Tìm tiếp h2.topic-title, thay toàn bộ phần đó thành

Code:

h2.topic-title {display: inline-block;width: 85%;overflow: hidden;}

Code:

<style>a.topictitle {
display: inline-block;
white-space: nowrap;
overflow: hidden;
width: 85%;
text-overflow: ellipsis;
}
a.topictitle:hover {
display: inline;
white-space: normal;
text-shadow: none;
}</style>

@markai30, @NCat : em đã làm được rùi , nhưng còn chưa hài lòng là cái icon nó bị lệch xuống tí , nhìn xấu xấu :v

Tắt icon đó đi :v dù sao nhìn cũng ko ai để ý

Code:

<style>a.topictitle {
display: inline-block;
white-space: nowrap;
overflow: hidden;
width: 85%;
text-overflow: ellipsis;
}
a.topictitle:hover {
display: inline;
white-space: normal;
text-shadow: none;
}</style>

Cái code này , thêm vào cũng còn một số cái bị xuống dòng , nhìn khó chịu wá , ai giúp em đi
Demo : http://www.xshop.cf/f2-forum