0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-03 15:24:19 +01:00
Bootstrap/examples/offcanvas/offcanvas.css
UTCWebDev ee2e2ae0ae Prevent X-scroll on small screens
html overflow-x must be hidden to prevent accidental x-scroll on small screens. This is more apparent with touch screens, where the user often gestures diagonally instead of a true vertical gesture.
2013-08-28 15:55:45 -04:00

52 lines
877 B
CSS

/*
* Style tweaks
* --------------------------------------------------
*/
html {
overflow-x: hidden;
}
body {
padding-top: 70px;
}
footer {
padding-left: 15px;
padding-right: 15px;
}
/*
* Off Canvas
* --------------------------------------------------
*/
@media screen and (max-width: 767px) {
.row-offcanvas {
position: relative;
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
}
.row-offcanvas-right
.sidebar-offcanvas {
right: -50%; /* 6 columns */
}
.row-offcanvas-left
.sidebar-offcanvas {
left: -50%; /* 6 columns */
}
.row-offcanvas-right.active {
right: 50%; /* 6 columns */
}
.row-offcanvas-left.active {
left: 50%; /* 6 columns */
}
.sidebar-offcanvas {
position: absolute;
top: 0;
width: 50%; /* 6 columns */
}
}