SharePoint responsive design

Question

I am hunting for some help to do sharepoint site responsive. I just started to look into css media queries but it did not work. Any thoughts on this.? I am adding simple

<style>
#customDiv {background-color: lightgreen;}
@media screen and (max-width: 500px) {
#customDiv{
background-color: lightblue;
}
}
</style>​​

<div id="customDiv">

​​​​

Resize the browserwindow. When the width of this document is less than 300 pixels, the background-color is "lightblue", otherwise it is "lightgreen".

any inputs will be better as I am new to this responsive design.

Answer 1

Branding SharePoint can be a fun, rewarding yet often times challenging endeavor. SharePoint is extremely powerful, but with that power comes complexity that makes its way into the front end HTML, JavaScript and CSS as well. You throw Responsive Web Design principles and a grid layout, which is all of the rage right now in web design, and you might be in for it.

For SharePoint one is readily available http://responsivesharepoint.codeplex.com/