Since we build mobile sites for clients and developers with Divi, on some occasions we only build the home page with a true mobile look, and link to the responsive pages. With this scenario we want the header and footer to show on posts and pages, but not on the homepage mobile view. This code comes in really handy for just that. Simply add the code below to your Global CSS and you will be in business.

Short video showing how this CSS works.

@media only screen and ( max-width: 768px ) {
.home #main-header { display:none; }
.home #page-container { padding-top:0px !important }
.home #main-footer { display:none; }

About Joe Styer

In an early 2010 ITU (International Telecommunication Union) report said that with the current growth rates, web access by people on the go — via laptops and smart mobile devices – is likely to exceed web access from desktop computers within the next five years. In 2008 two years prior to the ITU report, tech blogs from several countries wrote about my mobile site services.