Tagged: Fixed Header, mobile resolution
Customer request: Fixed header even in mobile resolution.
This was possible by default – even on mobile. Now the enfold backend says that the mobile resolution ignores it… (1)
a) Why is this? I know it definitely worked.
b) How can I configure it anyway?
c) How can I control the appearance of the header so that it doesn’t take up too much space, especially in landscape mode (where it was always too bold)? Like:
/***** HEADER *****/
.class {
max-width: 100%;
}
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
.class {max-height: px;}
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
.class {max-height: px;}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
.class {max-height: px;}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
.class {max-height: px;}
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
.class {max-height: px;}
}