2012-07-17 3 views
0

Проверьте изображение по этой ссылке www.checkwebsitedemo.com/paging.jpg , вы заметите, что часть из следующего >> завернута в 2 строки, т.е. >> отображается во 2-й строке, я хочу их всегда иметь их в одной строке. Если пространство меньше, то вся Следующая кнопка должна перейти к следующей строке, но не должна прерываться.Css text new line issue

Пожалуйста, дайте мне знать, как я могу это сделать через css. Ниже мой код css.

.paging {font-size:15px !important; line-height:250%; text-align:center;} 
    .paging .paginate, span.inactive, a.current {font-size:12px; margin:1px; padding:3px 5px;} 
    .paging span.paginate_dropdown {float:right;} 
    .paging span.inactive {background:none !important; border:1px solid #CCCCCC !important; color:#CCCCCC !important; cursor: default;} 
    .paging a.paginate {border:1px solid #CCCCCC; color:#0A246A; text-decoration:none;} 
    .paging a.paginate:hover {background:#088AD8; border:1px solid #000000; color:#FFFFFF; text-decoration:none; text-shadow:0 1px 1px #000000;} 
    .paging a.current {background:#088AD8; border:1px solid #000000; color:#FFFFFF; font-weight:bold; text-decoration:none; text-shadow:0 1px 1px #000000;} 

Заранее спасибо.

+0

Пожалуйста, используйте только соответствующие теги для своих вопросов. –

+0

уверен, приятель, извините, что, поскольку я новичок в переполнении стека, поэтому я этого не знал. в любом случае спасибо. позаботится об этом в будущем. – Asnexplore

ответ

0

Добавить white-space:nowrap; в CSS кнопки, о которой вы говорите.

0

Использование display: inline-block; должно содержать эту кнопку для совместного использования; либо остаться на первой линии, либо спрятаться вместе.

В целом, однако, вы должны настроить свои стили так, чтобы кнопки не попадали во вторую строку. Возможно, «...» еще несколько страниц.