library-mirrors/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma.git synced 2024-11-14 11:14:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Explain fullhd container

Browse Source
This commit is contained in:
Jeremy Thomas 2017-03-15 21:03:38 +00:00
parent 10dfb6eac3
commit 292faa1586
1 changed files with 8 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
docs/documentation/layout/container.html
View File

@ -23,10 +23,14 @@ doc-subtab: container
<li><code>.section</code></li> <li><code>.section</code></li>
<li><code>.footer</code></li> <li><code>.footer</code></li>
</ul> </ul>
<p>On <strong>mobile</strong> and <strong>tablet</strong>, the container will have a margin of <strong>20px</strong> on both the left and right sides.</p> <p>This is how the container will behave:</p>
<p>On <strong>desktop</strong> (>= 1000px), the container will have a maximum width of <strong>960px</strong> and will be <strong>horizontally centered</strong>.</p> <ul>
<p>On <strong>widescreen</strong> (>= 1192px), the container will have a maximum width of <strong>1152px</strong>.</p> <li>on <strong>mobile</strong> and <strong>tablet</strong>, it will have a margin of <strong>20px</strong> on both the left and right sides.</li>
<p>The values <strong>960</strong> and <strong>1152</strong> have been chosen because they are divisible by both <strong>12</strong> and <strong>16</strong>.</p> <li>on <strong>desktop</strong> (>= 1000px), it will have a maximum width of <strong>960px</strong> and will be <strong>horizontally centered</strong>.</li>
<li>on <strong>widescreen</strong> (>= 1192px), it will have a maximum width of <strong>1152px</strong>.</li>
<li>on <strong>fullhd</strong> (>= 1384px), it will have a maximum width of <strong>1344px</strong>.</li>
</ul>
<p>The values <strong>960</strong>, <strong>1152</strong> and <strong>1344</strong> have been chosen because they are divisible by both <strong>12</strong> and <strong>16</strong>.</p>
</div> </div>
</div> </div>