Question

我想将00:00:01 00:00:02 00:00:03 00:00:04 00:00:05 00:00:06 00:00:07 00:00:08 00:00:09 00:00:10 00:00:11 00:00:12与bootstrap的课程text-overflow: ellipsis一起使用，并将图片放在此文字旁边。所以左边的文字和右边的图像在同一条线上。我尝试了以下方法，但没有成功。我希望文本和图像位于同一行，text-nowrap。

text-overflow: ellipsis

这是代码http://www.bootply.com/P0lbiPhLDo

Answer 1

您可以添加到第一个div：

position:relative;
display:inline-block;
width:55%;

而第二个div：

display:block;
position:relative;
width:40%;

摘录：

＆＃13;

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">


<div class="col-lg-6">

  <div class="text-nowrap" style="overflow: hidden; text-overflow: ellipsis;position:relative;display:inline-block;width:55%;">
      <a>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing</a>
    </div>

  <div style="float:right;display:block;position:relative;width:40%;">
        <img src="http://www.w3schools.com/html/pic_mountain.jpg" class="img-responsive" style="max-height: 30px;">
    </div>   

</div>

＆＃13;

使用文本溢出将文本放在文本旁边：使用同一行上的引导程序省略省略号

1 个答案: