CSS Media Query alternative

Using Javascript:

We need this function to return width and height.

function viewport() {
        var e = window, a = 'inner';
        if (!('innerWidth' in window )) {
            a = 'client';
            e = document.documentElement || document.body;
        }
        return { width : e[ a+'Width' ] , height : e[ a+'Height' ] };
}

we get the value of the width by using viewport().width.

Example:
//use this if viewport width is less than or equal to 768px
if(viewport().width <= 768){
            search_form.css({left: "125px", top: "50px"});
}

Got this function somewhere in Stackoverflow

:nth-child(n):hover in menu lists combination tip

instead of doing this:

nav ul li a:nth-child(n):hover

you can also do this:

nav ul li:nth-child(n) a:hover


lol?

Background Image on HTML5 Search input in Chrome/Safari wont show fix tip

input[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box; /* 2 */
    box-sizing: content-box;
}

put this css snippet in your reset.css (if any) or place this as one of your resets on your style.css