Adding a 'horizontal' option to description lists, similar to .form-horizontal
This commit is contained in:
parent
43760eb202
commit
0a8efd5320
7 changed files with 575 additions and 207 deletions
|
|
@ -130,6 +130,41 @@ dt {
|
|||
dd {
|
||||
margin-left: @baseLineHeight / 2;
|
||||
}
|
||||
// Horizontal layout (like forms)
|
||||
dl.horizontal {
|
||||
dt {
|
||||
float: left;
|
||||
clear: left;
|
||||
width: 120px;
|
||||
text-align: right;
|
||||
}
|
||||
dd {
|
||||
margin-left: 130px;
|
||||
}
|
||||
&.horizontal-mini {
|
||||
dt { width: 50px; }
|
||||
dd { margin-left: 60px; }
|
||||
}
|
||||
&.horizontal-small {
|
||||
dt { width: 90px; }
|
||||
dd { margin-left: 100px; }
|
||||
}
|
||||
&.horizontal-normal {
|
||||
// no additional styles needed
|
||||
}
|
||||
&.horizontal-large {
|
||||
dt { width: 140px; }
|
||||
dd { margin-left: 150px; }
|
||||
}
|
||||
&.horizontal-xlarge {
|
||||
dt { width: 170px; }
|
||||
dd { margin-left: 180px; }
|
||||
}
|
||||
&.horizontal-xxlarge {
|
||||
dt { width: 190px; }
|
||||
dd { margin-left: 200px; }
|
||||
}
|
||||
}
|
||||
|
||||
// MISC
|
||||
// ----
|
||||
|
|
@ -198,7 +233,7 @@ blockquote {
|
|||
// Quotes
|
||||
q:before,
|
||||
q:after,
|
||||
blockquote:before,
|
||||
blockquote:before,
|
||||
blockquote:after {
|
||||
content: "";
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue