I learn 960 Grid CSS Framework, and I have a HTML code and CSS below:
- HTML code:
@import url( 'css/reset.css' );
@import url( 'css/text.css' );
@import url( 'css/960.css' );
#wrapper {
width: 100%;
}
#wp_head,
#wp_foot {
background-color: #e8e8e8;
}
#header,
#footer {
border:1px dotted #333;
min-height: 100px;
}
#content {
border: 1px dotted #333;
min-height: 500px;
}
#row-1 {
}
.row-1-left{
border: 1px dotted #333;
background-color: pink;
min-height: 50px;
}
.row-1-center {
border: 1px dotted #333;
background-color: yellow;
min-height: 50px;
}
.row-1-right{
border: 1px dotted #333;
background-color: lime;
min-height: 50px;
}<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Learn 960 grid</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="wrapper">
<div id="wp_head">
<div id="header" class="container_12">Header</div>
</div>
<div id="row-1" class="container_12 clearfix">
<div class="row-1-left grid_4">Left - 4</div>
<div class="row-1-center grid_4">Center - 4</div>
<div class="row-1-right grid_4">Right - 4</div>
</div>
<div id="wp_foot">
<div id="footer" class="container_12">Footer</div>
</div>
</div>
</body>
</html>And then, show result below (See image attachment):
Question: I want remove margin-left and margin-right. Please help me!
You can do that with:
Here is a fiddle: https://jsfiddle.net/cpu5syg1/