强制文本留在Div中

Rif*_*fki 3 css breadcrumbs

我有一个显示在div中的面包屑页面.(25px高,700px宽)麻烦的是我有这么多页面,以及面包屑中的页面标题溢出div.有没有办法让最后几个面包屑页面强制将第一个面包屑页面留在视线之外并显示最后一个装在Div中的

希望这是有道理的

问候

[R

Bof*_*ain 6

是的,你可以使用overflow,floatwhite-space.

HTML:

<div class="breadcrumb-container">
    <div class="breadcrumb">
    Start aaaa aaaa End
    </div>
</div>
<div class="breadcrumb-container">
    <div class="breadcrumb">
    Start aaaa aaaa aaaa aaaa aaaa aaaa aaaa aaaa aaaa aaaa aaaa aaaa aaaa aaaa aaaa aaaa End
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS:

.breadcrumb-container {
    float:left; max-width:100%; margin:5px; overflow-x:hidden; background:orange;
}
.breadcrumb {
    float:right; margin:5px; white-space:nowrap; background:cyan;
}
Run Code Online (Sandbox Code Playgroud)

这将强制链接保持在一条线上并隐藏左侧的任何溢出文本,因此最后的类别是可见的.在float:left从右边距开始停止面包屑.