Mobile layout

[Thomas Wadham-Gagnon]

Hello,

Im presently customizing the foxy theme for client who wants a unified gray sidebar. So far so good but when I resize the browser to the mobile version the sidebar background moves down and messes with the layout.

Here is the dev subdomain: http://ceramique.wgpro.ca

Ive arbitrarily set the height of the sidebar to 1500px so it fits the full page, and would like to customize its height and color for mobile devices in such a way that would make it disappear.

Any indication on how to customize the mobile layout would be really appreciated. Thanks for your time.

Tom

[Bill Robbins]

Tom,

Nice looking site. You can hide the sidebar on smaller devices. You can place this CSS snippet either in the Custom CSS box on the styling tab of the theme options page or at the bottom of the style.css file if you’d rather edit it directly:

@media only screen and (max-width: 767px) {

	aside.sidebar {
		display: none;
	}

}

That will hide the sidebar completely on devices smaller than an iPad.

If you have any questions or trouble, let me know,
Bill

[Author]

Posts