No not really, the layout changes based on the browser window size. Always resizing as the screen gets smaller regardless of desktop or mobile devices. For it to drop to tablet view your screen size would have to drop below 940px wide. A 14 inch laptop should have a wider screen than that?
The only thing you can do is change the pixel breaking point when the change happens. So for instance if you don’t want the menu to switch toll the browser window gets below 780px add this to your custom css box in the theme options.
@media (max-width: 979px) {
#nav-main ul.sf-menu {display: block;}
#mobile-nav-trigger {display: none;}
#nav-second ul.sf-menu {display: block;}
}
@media (max-width: 779px) {
#nav-main ul.sf-menu {display: none;}
#mobile-nav-trigger {display: block;}
#nav-second ul.sf-menu {display: none;}
}
Kadence Themes
Thanks, that makes perfect sense, i’ll give that a shot.
Another question then:
I notice that even when I try to “center” certain contents, it still shows up on the left side of the screen. For instance, I’m using the “wunderslider” plugin, and even if i “center” the shortcode, it still pushes the output (i.e. the slider) to the left. Any idea if that’s something in the theme code, or if that’s a plugin issue? I noticed the same issue using gallery shortcodes, for what it’s worth.
Thanks.
Are you using a fullwidth page? can you post a link to where it’s happening?
Kadence Themes
Here you go
http://www.maryjotait.com
Using a “Static Front Page” display option, and the page is set to Full Width.
It’s an issue with the wonderslider, it’s not allowing itself to be wrapped in a p with text align center. It’s also not positioning itself properly. You can use this css to make it work, just add to your custom css:
.wunderslider-wrapper {
margin: 0 auto;
}
Kadence Themes
Hi Kadence,
First of all thanks for the great theme.
I’m also having some problems to get this right.
If screen resolution drops below 900px, the top-menu is spit into two rows.
Is it possible to:
A) use the full screen width for the top menu (I don’t think so, I saw another post stating that the theme isn’t designed for this)
B) Instead of splitting the menu jump straight to the mobile menu. Now when resizing between 900px and 745px the top menu is split into 2 rows.
Here’s my custom css:
.subhead .postedintop, .kad-hidepostedin {display:none;}
.kad-hidepostauthortop, .postauthortop {display:none;}
.postcommentscount {display:none;}
@media (min-width: 940px) {
.topbarmenu ul li a {font-size: 20px;}
}
@media (max-width: 940px) {
#nav-main ul.sf-menu {display: block;}
#mobile-nav-trigger {display: none;}
#nav-second ul.sf-menu {display: none;}
}
@media (max-width: 939px) {
#nav-main ul.sf-menu {display: none;}
#mobile-nav-trigger {display: block;}
#nav-second ul.sf-menu {display: none;}
}
Site: http://www.timmhost.com
Thanks,
TimM
You can add this to make the menu area full page width:
.kad-header-left {
display:none;
}
kad-header-right {
width: 100%;
}
Kadence Themes
Thanks, it worked like a charm.
Grtz,
TimM
