Isaac Meneses Isaac Meneses - 23 days ago 7
CSS Question

Creating divs that stand side by side

I want to create divs that stand side by side with and each one fill 25% of the screen in height and width. My script creates divs with 25% height and width, but they stay one below the other. My script is:



function createDiv() {
var div_created = document.createElement("div");
div_created.setAttribute("class", "div1");

document.body.appendChild(div_created);
}

.div1 {
width: 50%;
height: 50%;
background-color: #000000;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="estilo_segundo.css">
<body>
<button onclick="createDiv()">Click</button>
</body>




Answer
.div1 {
  width: 50%;
  height: 50%;
  background-color: #000000;
  float:left;
}