Remove Responsive on iPad view

[beautyfool]

Hi everyone, I was wondering if someone could help me with my theme (Mindstream). My blog is over at http://www.beautyfool.com. I absolutely love the mobile responsive theme, however I was wondering if just for the iPad; can it be kept to "normal". So that on a laptop and iPad it will look normal, and anything smaller than that - other tablets and cellphones - it will move to the responsive theme.
Thank you very much,
Renee

[SoZo]

Sure, just remove the responsive section of the style sheet that corresponds with the iPads resolution.

---

John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

[beautyfool]

Hi SoZo, thanks for your response.

Sorry I am totally new to do... which code would that be?

Thanks,

Renee

[SoZo]

Actually, you'll need to move all the rules you want from the @media only screen and (max-width: 1024px) section into the @media only screen and (max-width: 600px) section. So you end up with something like:

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

	h1,
	h2,
	h2 a,
	h2 a:visited {
		font-size: 30px;
	}

	h3,
	h4 {
		font-size: 24px;
	}

	.five-sixths,
	.four-fifths,
	.four-sixths,
	.one-fifth,
	.one-fourth,
	.one-half,
	.one-sixth,
	.one-third,
	.three-fifths,
	.three-fourths,
	.three-sixths,
	.two-fifths,
	.two-fourths,
	.two-sixths,
	.two-thirds {
		padding: 0;
		width: 100%;
	}

	body {
		width: 100%;
		margin: 0 auto;
	}
	
	.archive-page,
	.content-sidebar #content,
	.footer-widgets-1,
	.footer-widgets-2,
	.footer-widgets-3,
	.full-width-content.mindstream-landing #content,
	.full-width-content #content,
	.mindstream-landing .wrap,
	.sidebar,
	.sidebar-content #content,
	.wrap,
	#content-sidebar-wrap,
	#footer .creds,
	#footer .gototop,
	#footer-widgets .wrap,
	#header .widget-area,
	#sidebar-alt,
	#title-area {
		width: 100%;
	}

	.menu-primary,
	.menu-secondary,
	#footer .creds,
	#footer .gototop,
	#header ul.menu,
	#header .widget-area,
	#title-area {
		float: none;
		text-align: center;
		width: 100%;
	}

	.content-sidebar #sidebar .widget,
	.sidebar-content #sidebar .widget,
	#footer,
	#header {
		background: none;
		background-color: #222;
	}
	
	#header ul.menu {
		float: none;
	}

	#title-area {
		padding: 20px 0 10px;
	}

	#header .widget-area {
		padding: 0;
	}

	#header .searchform {
		float: none;
		padding: 0;
		text-align: center;
	}

	.menu-primary li,
	.menu-secondary li,
	#header ul.menu li {
		display: inline-block;
		float: none;
	}

	.menu li.right {
		display: none;
	}

	.menu li li {
		text-align: left;
	 }

	#inner {
		padding: 20px 0 0;
	}

	.breadcrumb,
	.navigation,
	.sidebar .widget,
	.taxonomy-description {
		margin: 0 20px 20px;
	}
	
	#content {
		padding: 25px 0;
	}

	.full-width-content.mindstream-landing #content {
		margin: 0;
	}

	.full-width-content.mindstream-landing #inner {
		padding: 0;
	}

	.page .page,
	.post,
	#comments,
	#respond {
		padding: 0 20px;
	}

	.author-box {
		margin: 0 20px 40px;
	}
	
	#footer-widgets {
		margin: 10px auto 0;
	}
	
	#footer-widgets .widget {
		padding: 20px 20px 0;
	}

	#footer-widgets .wrap {
		padding: 0;
	}

	.footer-widgets-1,
	.footer-widgets-2,
	.footer-widgets-3 {
		margin: 0;
	}

	#footer .wrap {
		padding: 20px 0;
	}

}

---

John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

[beautyfool]

Hi SoZo,

Thank you. I tried what you said (I copied the code from the max-width 1024 to max-width 600) but nothing has seemed to change.

Renee

[SoZo]

You still have the original 1024 section in there. Replace all the responsive rules with what I posted above.

---

John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

[beautyfool]

Hi SoZo,

It worked perfectly! Thanks so much for your time. 🙂

Renee

[beautyfool]

Sorry one more thing...

Now when the ipad is facing up (768px i think), my sidebar has been cut out.

Should I just change the max width from 600 to 768 to fix this?

Thank you!

Renee

[SoZo]

Does it work to change it to 768?

---

John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

[Author]

Posts