11) Code

 

@media screen and (max-width: 960px) {
	#container, footer { width: 758px; }
	#content { margin: 0 20px 0 0; }
	#sidebar { width: 212px; }
	#sidebar section { clear: left; }
	#sidebar #search #searchbar { width: 152px; }
}

@media screen and (max-width: 758px) {
	#container, footer, #sidebar { width: 524px; }
	header nav { clear: left; float: none; overflow: hidden; }
	header nav li { width: auto; margin: 0 25px 0 0; }
	header { margin: 0 0 44px 0; }
	header h1 { margin: 0 0 24px 0; }
	#sidebar section { float: left; clear: none; }
	#sidebar #social { margin: 0 20px 47px 0; }
	#sidebar #search #searchbar { width: 464px; }
}

@media screen and (max-width: 524px) {
	#container, footer, #sidebar, #content { width: 292px; }
	#content article h2 { font-size: 24px; }
	#content .postinfo li { margin: 0 10px 0 0; }
	#sidebar #social { margin: 0; }
	#sidebar #search #searchbar { width: 230px; }
}

 

 

 

Advertisements

More Information

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s