Всем доброго времени суток!
Вопрос знатокам javascript. Есть вот такой код.
<!DOCTYPE html>
<html>
<head>
<title>JS</title>
</head>
<style>
body{
margin: 0;
}
#contaner{
margin: 0;
padding: 0;
}
.wrapper{
margin: 0;
padding: 0;
height: 32px;
}
.first{
width: 30px;
height: 30px;
background: green;
display: inline-block;
margin: 1px;
padding: 0;
}
.main{
width: 30px;
height: 30px;
background: blue;
display: inline-block;
margin: 1px;
padding: 0;
}
span{
width: 30px;
}
</style>
<body>
<div id="contaner"></div>
</body>
<script type="text/javascript">
var stop = 5;
var cntr = document.getElementById("contaner");
for(var i=0; i<stop; i++){
var wrap = document.createElement("div");
wrap.className = "wrapper";
cntr.appendChild(wrap);
for(var j=0; j<stop; j++){
var first = document.createElement("div");
first.className = "first";
wrap.appendChild(first);
if(j == 3){
first.innerHTML = j;
}
}
}
</script>
</html>
Вывод дает результат при котором дивы, находящееся в блоке if, вываливаются из общего ряда.
Если убрать блок if, тогда все нормально.
Вопрос! Почему так происходит?
Заранее благодарю за помощь.
