0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-06 04:08:22 +01:00

remove .dividers from breadcrumbs, instead use :after and content

This commit is contained in:
Mark Otto 2012-09-25 22:57:20 -07:00
parent d1affe6154
commit ecbf1159a4
4 changed files with 16 additions and 12 deletions

View File

@ -4591,9 +4591,11 @@ input[type="submit"].btn::-moz-focus-inner {
text-shadow: 0 1px 0 #ffffff; text-shadow: 0 1px 0 #ffffff;
} }
.breadcrumb .divider { .breadcrumb li:after {
display: inline-block;
padding: 0 5px; padding: 0 5px;
color: #ccc; color: #ccc;
content: "\00a0 /";
} }
.breadcrumb .active { .breadcrumb .active {

View File

@ -1388,19 +1388,19 @@
<li class="active">Home</li> <li class="active">Home</li>
</ul> </ul>
<ul class="breadcrumb"> <ul class="breadcrumb">
<li><a href="#">Home</a> <span class="divider">/</span></li> <li><a href="#">Home</a></li>
<li class="active">Library</li> <li class="active">Library</li>
</ul> </ul>
<ul class="breadcrumb" style="margin-bottom: 5px;"> <ul class="breadcrumb" style="margin-bottom: 5px;">
<li><a href="#">Home</a> <span class="divider">/</span></li> <li><a href="#">Home</a></li>
<li><a href="#">Library</a> <span class="divider">/</span></li> <li><a href="#">Library</a></li>
<li class="active">Data</li> <li class="active">Data</li>
</ul> </ul>
</div> </div>
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;ul class="breadcrumb"&gt; &lt;ul class="breadcrumb"&gt;
&lt;li&gt;&lt;a href="#"&gt;Home&lt;/a&gt; &lt;span class="divider"&gt;/&lt;/span&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#"&gt;Library&lt;/a&gt; &lt;span class="divider"&gt;/&lt;/span&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Library&lt;/a&gt;&lt;/li&gt;
&lt;li class="active"&gt;Data&lt;/li&gt; &lt;li class="active"&gt;Data&lt;/li&gt;
&lt;/ul&gt; &lt;/ul&gt;
</pre> </pre>

View File

@ -1319,19 +1319,19 @@
<li class="active">{{_i}}Home{{/i}}</li> <li class="active">{{_i}}Home{{/i}}</li>
</ul> </ul>
<ul class="breadcrumb"> <ul class="breadcrumb">
<li><a href="#">{{_i}}Home{{/i}}</a> <span class="divider">/</span></li> <li><a href="#">{{_i}}Home{{/i}}</a></li>
<li class="active">{{_i}}Library{{/i}}</li> <li class="active">{{_i}}Library{{/i}}</li>
</ul> </ul>
<ul class="breadcrumb" style="margin-bottom: 5px;"> <ul class="breadcrumb" style="margin-bottom: 5px;">
<li><a href="#">{{_i}}Home{{/i}}</a> <span class="divider">/</span></li> <li><a href="#">{{_i}}Home{{/i}}</a></li>
<li><a href="#">{{_i}}Library{{/i}}</a> <span class="divider">/</span></li> <li><a href="#">{{_i}}Library{{/i}}</a></li>
<li class="active">{{_i}}Data{{/i}}</li> <li class="active">{{_i}}Data{{/i}}</li>
</ul> </ul>
</div> </div>
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;ul class="breadcrumb"&gt; &lt;ul class="breadcrumb"&gt;
&lt;li&gt;&lt;a href="#"&gt;{{_i}}Home{{/i}}&lt;/a&gt; &lt;span class="divider"&gt;/&lt;/span&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;{{_i}}Home{{/i}}&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#"&gt;{{_i}}Library{{/i}}&lt;/a&gt; &lt;span class="divider"&gt;/&lt;/span&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;{{_i}}Library{{/i}}&lt;/a&gt;&lt;/li&gt;
&lt;li class="active"&gt;{{_i}}Data{{/i}}&lt;/li&gt; &lt;li class="active"&gt;{{_i}}Data{{/i}}&lt;/li&gt;
&lt;/ul&gt; &lt;/ul&gt;
</pre> </pre>

View File

@ -13,7 +13,9 @@
display: inline-block; display: inline-block;
text-shadow: 0 1px 0 @white; text-shadow: 0 1px 0 @white;
} }
.divider { li:after {
display: inline-block;
content: "\00a0 /"; // Unicode space added since inline-block means non-collapsing white-space
padding: 0 5px; padding: 0 5px;
color: #ccc; color: #ccc;
} }