DavidBernalGonzalez/index.html

## index.html
<!DOCTYPE html>
<html lang="es">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="normalize.css">
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <div class="container">

    </div>
            <div class="box box-1">1</div>
            <div class="box box-2">2</div>
            <div class="box box-3">3</div>
            <div class="box box-4">4</div>
</body>

</html>

## style.css
.container{
    width: 100px;
    height: 100px;
    background-color: red;
    display: block;
    border: solid 1px black;
    margin: 50px;

}

.box{
      width: 20px;
      background-color: yellowgreen;
      border: solid 1px black;
      border-radius: 50%;
      -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
      -ms-border-radius: 50%;
      -o-border-radius: 50%;
      text-align: center;
      position: aboslute;
}

.box-1{
    position: absolute;
    top: 41px;
    left: 38px;
}

.box-2{
    position: absolute;
    top: 41px;
    left: 138px;
}

.box-3{
    position: absolute;
    top: 140px;
    left: 37px;
}

.box-4{
    position: absolute;
    top: 140px;
    left: 137px;
}
	<!DOCTYPE html>
	<html lang="es">

	<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	<link rel="stylesheet" href="normalize.css">
	<link rel="stylesheet" href="style.css">
	</head>

	<body>
	<div class="container">

	</div>
	<div class="box box-1">1</div>
	<div class="box box-2">2</div>
	<div class="box box-3">3</div>
	<div class="box box-4">4</div>
	</body>

	</html>
	.container{
	width: 100px;
	height: 100px;
	background-color: red;
	display: block;
	border: solid 1px black;
	margin: 50px;

	}

	.box{
	width: 20px;
	background-color: yellowgreen;
	border: solid 1px black;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	text-align: center;
	position: aboslute;
	}

	.box-1{
	position: absolute;
	top: 41px;
	left: 38px;
	}

	.box-2{
	position: absolute;
	top: 41px;
	left: 138px;
	}

	.box-3{
	position: absolute;
	top: 140px;
	left: 37px;
	}

	.box-4{
	position: absolute;
	top: 140px;
	left: 137px;
	}