KSS Style Guide

5 #Display Display

Classes for setting the display property of an element.

Source: dist/full/full.css, line 1932
Examples
Default styling
A div
.ds-bl
Sets diplay to block
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 1971
Examples
Default styling
A div
.ds-lg-bl
Sets diplay to block on lg
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2262
Examples
Default styling
A div
.ds-md-bl
Sets diplay to block on md
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2165
Examples
Default styling
A div
.ds-sm-bl
Sets diplay to block on sm
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2068
Examples
Default styling
A div
.ds-fl
Sets diplay to flex
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 1987
Examples
Default styling
A div
.ds-lg-fl
Sets diplay to flex on lg
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2278
Examples
Default styling
A div
.ds-md-fl
Sets diplay to flex on md
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2181
Examples
Default styling
A div
.ds-sm-fl
Sets diplay to flex on sm
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2084
Examples
Default styling
A div
.ds-gr
Sets diplay to grid
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2003
Examples
Default styling
A div
.ds-lg-gr
Sets diplay to grid on lg
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2294
Examples
Default styling
A div
.ds-md-gr
Sets diplay to grid on md
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2197
Examples
Default styling
A div
.ds-sm-gr
Sets diplay to grid on sm
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2100
Examples
Default styling
A div
.ds-ib
Sets diplay to inline-block
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 1955
Examples
Default styling
A div
.ds-lg-ib
Sets diplay to inline-block on lg
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2246
Examples
Default styling
A div
.ds-md-ib
Sets diplay to inline-block on md
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2149
Examples
Default styling
A div
.ds-sm-ib
Sets diplay to inline-block on sm
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2052
Examples
Default styling
A div
.ds-in
Sets diplay to inline
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 1939
Examples
Default styling
A div
.ds-lg-in
Sets diplay to inline on lg
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2230
Examples
Default styling
A div
.ds-md-in
Sets diplay to inline on md
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2133
Examples
Default styling
A div
.ds-sm-in
Sets diplay to inline on sm
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2036
Examples
Default styling
A div
.ds-no
Sets diplay to none
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2019
Examples
Default styling
A div
.ds-lg-no
Sets diplay to none on lg
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2310
Examples
Default styling
A div
.ds-md-no
Sets diplay to none on md
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2213
Examples
Default styling
A div
.ds-sm-no
Sets diplay to none on sm
A div
Markup
<div class="[modifier class]">A div</div>
Source: dist/full/full.css, line 2116