Verekia verekia

## main.css
#this-is-a-fluid-container {
    width: 50%;
    padding: 20px 10%;
    margin: 0 10%;
}

## main.css
@media only screen and (min-width: 480px) {
    nav a {
        float: left;
        width: 27%;
        margin: 0 1.7%;
        padding: 25px 2%;
        margin-bottom: 0;
    }
}

## main.css
@media only screen and (min-width: 768px) {

    #title {
        float: left;
    }

    nav {
        float: right;
        width: 38%;
    }

## main.css
@media only screen and (min-width: 1140px) {

    .wrapper {
        width: 1026px; /* 1140px - 10% for margins */
        margin: 0 auto;
    }
}

## index.html
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>A simple MVC structure</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <div id="container">
        <h1>My users</h1>

## style.css
#container{
    font-family:Calibri, Helvetica, serif;
    color:#444;
    width:200px;
    margin:100px auto 0;
    padding:30px;
    border:1px solid #ddd;
    background:#f6f6f6;
    -webkit-border-radius:4px;
       -moz-border-radius:4px;

## main.js
var MyMath = (function(){

    // Put your private variables and functions here

    return { // Here are the public methods
        add:function(a, b){
            return a + b;
        }
    };
})();

## main.js
var MyMath = (function(){

    // With this pattern you can use the usual function notation:

    function add(a, b){
        return a + b;
    }

    return {
        add:add // But don't forget to declare it in the returned object!

## main.js
define(function(){

    function add(a, b){
        return a + b;
    }

    return {
        add:add
    };
});

## main.js
require(['MyMath'], function(MyMath){

    console.log(MyMath.add(1, 2));

});
	#this-is-a-fluid-container {
	width: 50%;
	padding: 20px 10%;
	margin: 0 10%;
	}
	@media only screen and (min-width: 480px) {
	nav a {
	float: left;
	width: 27%;
	margin: 0 1.7%;
	padding: 25px 2%;
	margin-bottom: 0;
	}
	}
	@media only screen and (min-width: 768px) {

	#title {
	float: left;
	}

	nav {
	float: right;
	width: 38%;
	}
	@media only screen and (min-width: 1140px) {

	.wrapper {
	width: 1026px; /* 1140px - 10% for margins */
	margin: 0 auto;
	}
	}
	<!doctype html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>A simple MVC structure</title>
	<link rel="stylesheet" href="css/style.css">
	</head>
	<body>
	<div id="container">
	<h1>My users</h1>
	#container{
	font-family:Calibri, Helvetica, serif;
	color:#444;
	width:200px;
	margin:100px auto 0;
	padding:30px;
	border:1px solid #ddd;
	background:#f6f6f6;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	var MyMath = (function(){

	// Put your private variables and functions here

	return { // Here are the public methods
	add:function(a, b){
	return a + b;
	}
	};
	})();
	var MyMath = (function(){

	// With this pattern you can use the usual function notation:

	function add(a, b){
	return a + b;
	}

	return {
	add:add // But don't forget to declare it in the returned object!
	define(function(){

	function add(a, b){
	return a + b;
	}

	return {
	add:add
	};
	});
	require(['MyMath'], function(MyMath){

	console.log(MyMath.add(1, 2));

	});