Html 在一行中显示路径,无元素换行

Html 在一行中显示路径,无元素换行,html,css,Html,Css,我需要一个div元素,其中divs和search items显示在一行中,divs将包含文件夹名称和拆分(\),而search item将包含该文件夹的路径 不知怎么的,看起来是这样的: \Some\path 结构如下所示: /*搜索*/ .app.searchbar.object{ 高度:50px; 最小宽度:100%; 背景:rgb(35,35,35); 浮动:左; 换行字:无; 断字:无; 显示:块; } .app.searchbar.item{ 边缘顶部:10px; 边缘底部:10px

我需要一个div元素,其中
div
s和
search item
s显示在一行中,
div
s将包含文件夹名称和拆分(\),而
search item
将包含该文件夹的路径

不知怎么的,看起来是这样的:

\Some\path

结构如下所示:

/*搜索*/
.app.searchbar.object{
高度:50px;
最小宽度:100%;
背景:rgb(35,35,35);
浮动:左;
换行字:无;
断字:无;
显示:块;
}
.app.searchbar.item{
边缘顶部:10px;
边缘底部:10px;
左边距:5px;
颜色:rgb(150150150);
填充物:5px;
显示:内联块;
浮动:左;
}
.应用程序.搜索栏.项目:悬停{
过渡:所有0.1秒轻松;
背景:rgb(200200200);
颜色:rgb(125125125);
边界半径:5px;
}
.app.searchbar.split{}
.app.searchbar.split::before{
内容:“\\”;
颜色:rgb(100100100);
边缘顶部:15px;
边缘底部:15px;
左边距:5px;
颜色:rgb(150150150);
浮动:左;
}

A.
非常
特别的
路径
那个
包含
隐藏的
文件夹
那个
可以
破坏
你的
生活
所以
很

您可以添加
宽度:900px
(或任何适合您的固定宽度,但必须固定)和
overflow-x:visible
.app.searchbar.object
,并删除其中的浮动:

/*搜索*/
.app.searchbar.object{
高度:50px;
最小宽度:100%;
背景:rgb(35,35,35);
换行字:无;
断字:无;
显示:块;
宽度:900px;
溢出x:可见;
}
.app.searchbar.item{
边缘顶部:10px;
边缘底部:10px;
左边距:5px;
颜色:rgb(150150150);
填充物:5px;
显示:内联块;
浮动:左;
}
.应用程序.搜索栏.项目:悬停{
过渡:所有0.1秒轻松;
背景:rgb(200200200);
颜色:rgb(125125125);
边界半径:5px;
}
.app.searchbar.split{}
.app.searchbar.split::before{
内容:“\\”;
颜色:rgb(100100100);
边缘顶部:15px;
边缘底部:15px;
左边距:5px;
颜色:rgb(150150150);
浮动:左;
}

A.
非常
特别的
路径
那个
包含
隐藏的
文件夹
那个
可以
破坏
你的
生活
所以
很

添加
溢出:滚动;空白:nowrap
.app.searchbar.object
并使用display:inline块显示
.item'和
.split`。似乎是这样

/*搜索*/
.app.searchbar.object{
高度:50px;
最小宽度:100%;
背景:rgb(35,35,35);
浮动:左;
显示:块;
溢出:滚动;
空白:nowrap;
}
.app.searchbar.split{
显示:内联块;
}
.app.searchbar.item{
边缘顶部:10px;
边缘底部:10px;
左边距:5px;
颜色:rgb(150150150);
填充物:5px;
显示:内联块;
}
.应用程序.搜索栏.项目:悬停{
过渡:所有0.1秒轻松;
背景:rgb(200200200);
颜色:rgb(125125125);
边界半径:5px;
}
.app.searchbar.split{}
.app.searchbar.split::before{
内容:“\\”;
颜色:rgb(100100100);
边缘顶部:15px;
边缘底部:15px;
左边距:5px;
颜色:rgb(150150150);
}

A.
非常
特别的
路径
那个
包含
隐藏的
文件夹
那个
可以
破坏
你的
生活
所以
很

所以你只想在溢出的情况下隐藏,是吗?是的,但我也想向下滚动将向右滚动我不明白在这种情况下向下滚动会是什么样子,例如
overflow:hidden
可以只隐藏溢出的条目。像这样吗?要将垂直滚动改为水平滚动,请使用“我不希望它超过100%的宽度”,因为这会破坏我的应用程序的工作方式。。。。