小编ptr*_*iek的帖子

我有这个HTML:

<ul>
    <li class="completed"><a href="#">I want the icon to stay on the same line as this last <strong>word</strong></li>
</ul>

我使用:after伪元素追加一个图标:

ul li.completed a:after {
    background:transparent url(img.png) no-repeat; 
    content: '';
    display:inline-block;
    width: 24px;
    height: 16px;
}

问题:如果可用宽度太小,图标将换行到下一行.我希望它与它附加到的链接的最后一个字保持在同一行:

这是可行的,没有在整个链接上添加'nowrap'(我希望单词包装,而不是图标).

在这里查看jsFiddle .

我有一个网站,我有多个css样式表用于打印,电视,屏幕,手持等...

我想知道哪种方法更好用(性能,可用性等......)

<link href="all.css" media="all" type="text/css" />
<link href="handheld.css" media="handheld" type="text/css" />
<link href="tv_print.css" media="tv, print" type="text/css" />

要么

<style type="text/css">
    @import url("all.css") all;
    @import url("handheld.css") handheld;
    @import url("tv_print.css") tv, print;
</style>

谢谢

我刚刚发现了Firefox的奇怪行为.

如果我有一个100px高度的表格单元格,并为其添加20px填充 - 它的总高度应该变为140px.

所有浏览器都正常运行,Firefox 8.0忽略了填充:

http://jsfiddle.net/8wDde/

有人知道修复吗？

我正在努力实现一些相当简单的事情,但无法理解它 - 谷歌没有任何帮助,而Bootstrap文档似乎有点令人困惑.

我需要的:

• 简单的可折叠手风琴,在页面加载时所有可折叠的处于关闭状态
• 只需单击一个按钮即可关闭所有可折叠按钮.

问题:

• 我的解决方案仅在用户打开/关闭一个或多个可折叠项时才有效
• 当我打电话时collapse('hide'),所有可折叠的东西都打开了,除非它们之前已经手动打开过.

见Jsfiddle.

我的加价:

<a class="btn btn-default" id="collapseall"><span class="icon"></span>Collapse 'm all!</a>

<div class="panel-group" id="accordion">
  <div class="panel panel-default">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
          Collapsible Group Item #1
        </a>
      </h4>
    </div>
    <div id="collapseOne" class="panel-collapse collapse">
      <div class="panel-body">
        Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. …