rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-21 18:54:30 +01:00
Code Issues Actions Packages Releases Activity

Fixes #8770: mobile-first (stacked by default) horizontal dls

Browse Source
This commit is contained in:
Mark Otto 2013-08-05 09:10:52 -07:00
parent 41eef69e6f
commit 6af693d160
4 changed files with 50 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
css.html
View File

@ -807,7 +807,7 @@ base_url: "../"
{% endhighlight %} {% endhighlight %}
<h4>Horizontal description</h4> <h4>Horizontal description</h4>
<p>Make terms and descriptions in <code>&lt;dl&gt;</code> line up side-by-side.</p> <p>Make terms and descriptions in <code>&lt;dl&gt;</code> line up side-by-side. Starts off stacked like default <code>&lt;dl&gt;</code>s, but when the navbar expands, so do these.</p>
<div class="bs-example"> <div class="bs-example">
<dl class="dl-horizontal"> <dl class="dl-horizontal">
<dt>Description lists</dt> <dt>Description lists</dt>

33
dist/css/bootstrap.css vendored
View File

@ -564,7 +564,8 @@ dd {
margin-left: 0; margin-left: 0;
} }
.dl-horizontal dt { @media (min-width: 768px) {
.dl-horizontal dt {
float: left; float: left;
width: 160px; width: 160px;
overflow: hidden; overflow: hidden;
@ -572,30 +573,26 @@ dd {
text-align: right; text-align: right;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.dl-horizontal dd {
.dl-horizontal dd {
margin-left: 180px; margin-left: 180px;
} }
.dl-horizontal dd:before,
.dl-horizontal dd:before, .dl-horizontal dd:after {
.dl-horizontal dd:after {
display: table; display: table;
content: " "; content: " ";
} }
.dl-horizontal dd:after {
.dl-horizontal dd:after {
clear: both; clear: both;
} }
.dl-horizontal dd:before,
.dl-horizontal dd:before, .dl-horizontal dd:after {
.dl-horizontal dd:after {
display: table; display: table;
content: " "; content: " ";
} }
.dl-horizontal dd:after {
.dl-horizontal dd:after {
clear: both; clear: both;
}
} }
abbr[title], abbr[title],

2
dist/css/bootstrap.min.css vendored
View File

File diff suppressed because one or more lines are too long

13
less/type.less
View File

@ -141,8 +141,14 @@ dt {
dd { dd {
margin-left: 0; // Undo browser default margin-left: 0; // Undo browser default
} }
// Horizontal layout (like forms)
.dl-horizontal { // Horizontal description lists
//
// Defaults to being stacked without any of the below styles applied, until the
// grid breakpoint is reached (default of ~768px).
@media (min-width: @grid-float-breakpoint) {
.dl-horizontal {
dt { dt {
float: left; float: left;
width: (@component-offset-horizontal - 20); width: (@component-offset-horizontal - 20);
@ -151,8 +157,9 @@ dd {
.text-overflow(); .text-overflow();
} }
dd { dd {
.clearfix(); // Clear the floated `dt` if an empty `dd` is present
margin-left: @component-offset-horizontal; margin-left: @component-offset-horizontal;
.clearfix(); // Clear the floated `dt` if an empty `dd` is present
}
} }
} }