I am trying to create a layout using a fixed header and sidebar (when visible/active) that does not disappear when scrolling, hope the http://jsfiddle.net/goltech/tfx1j6uh/ explains it better? Using the KendoUI ReponsivePanel and the demo from Kendo website. Thanking You
#sidebar {
/* panel background should be set to match design */
background: #092646;
}
article {
/* clear the floating sidebar */
overflow: hidden;
}
html, body {
margin: 0;
padding: 0;
}
body {
font-family: Arial, sans-serif;
}
header {
padding: 1em;
color: #fff;
background-image: linear-gradient(to top, #014F80 0%, #092646 100%);
}
h1 {
display: inline;
}
p {
padding: 2em;
}
nav a {
border: 1px solid #ccc;
background: #ddd;
display: block;
text-decoration: none;
padding: .5em;
}