Question

点击此链接查看图片www.checkwebsitedemo.com/paging.jpg ，你会注意到Next＆gt;＆gt;的一部分被包裹在2行中，即＆gt;＆gt;在第二行显示，我希望他们总是在同一行。如果空间较小，则整个Next按钮应转到下一行，但不应该中断。

请告诉我如何通过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;}

提前致谢。

Answer 1

使用display: inline-block;应该让该按钮粘在一起;要么留在第一线，要么一起推下来。

但总的来说，您应该调整样式，以便按钮永远不会被推到第二行。也许“......”还有几页。

Answer 2

将white-space:nowrap;添加到您正在谈论的按钮的CSS中。

Css文本新行问题

2 个答案: