HTML - CSS块宽度/高度

我有下面的CSS代码：HTML - CSS块宽度/高度

#nav {} 
#nav a { 
     position: relative; 
     display: inline-block; 
     color: #F0F0F0; 
     width: 1em; 
     height: 2em; 
     line-height: 0.9em; 
} 
#nav a.icon:before { padding-right: 0;} 

<nav id="nav"> 
    <a href="#me" class="fa fa-home active"><span>Home</span></a> 
</nav>

但是，如果文本的长度超过10个字符，它会自动作出一个段落，使文字从原包装盒中。我怎样才能防止这一点？

编辑

我只想在截图的背景框宽度文本变得更大更长

http://prntscr.com/2cd973

来源

2013-12-19 willier

如果超过10个字符，你想要一个段落的js代码？ –

你是说它*是*做出一段，而你希望它不会，或者它不是，你希望它会？ –

你试过类似'overflow：hidden;'的东西吗，这会在容器被填充时切断文本 –

，如果你的目的是要显示其所有在同一行，你只需要从#nav a

删除width:1em;，如果你想隐藏满溢添加overflow:hidden;到#nav a

，如果你想要的文字在a标签，以适应高度和宽度其内容从#nav a

来源

2013-12-19 15:34:58

我尝试了你的解决方案，但我仍然得到这个 http://prntscr.com/2cd8bx 我真的不知道该怎么做 – willier

你能清楚你的目标是什么我可以看到你的截图文本溢出，但你想用它做什么？把它藏起来？把它放在同一条线上？如果你可以提供一个小提琴它会很棒 –

所有我想要在屏幕截图中的背景框宽度随着文本更长而变得更大。不知道如何在小提琴中表现它，原因框是用js绘制的 – willier

您可以显示的内容作为table-row。然后，您的链接将显示为表格中的新列。

#nav { 
    display: table-row; 
}

您可以在this fiddle上查看结果。

来源

2013-12-19 15:34:04

删除width:1em;和height:2em;在#nav补充一点：

word-wrap:break-word;

来源

2013-12-19 15:35:57 Fox

HTML - CSS块宽度/高度

回答

相关问题