0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-18 15:54:26 +01:00

make it big screen friendly

This commit is contained in:
Mark Otto 2017-05-27 18:24:00 -07:00
parent 8627c506f7
commit 5b66579e4d
3 changed files with 10 additions and 2 deletions

View File

@ -13,11 +13,11 @@
{% include nav-home.html %}
<div class="container-fluid">
<div class="row">
<div class="row flex-xl-nowrap">
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
{% include nav-docs.html %}
</div>
<main class="col-12 col-md-9 col-xl-10 py-md-3 pl-md-5 bd-content" role="main">
<main class="col-12 col-md-9 col-xl-auto py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">{{ page.title }}</h1>
<p class="bd-lead">{{ page.description }}</p>
{% include ads.html %}

View File

@ -6,6 +6,7 @@
.bd-content {
@include media-breakpoint-up(xl) {
max-width: calc(100% - 320px);
padding-right: 20%;
#contents {
@ -24,6 +25,12 @@
}
}
@media (min-width: 2000px) {
#markdown-toc {
padding-left: 6rem;
}
}
// Hack the sticky header
h2[id],
h3[id] {

View File

@ -12,6 +12,7 @@
@include media-breakpoint-up(md) {
position: sticky;
top: 4rem;
max-width: 320px;
max-height: calc(100vh - 4rem);
overflow-y: auto;
}