I am currently using AngularJS to dynamically add divs to a section. My goal is to have each div start with a static width and then grow dynamically as I continue to add more divs. How can I achieve this?
The following code is not producing the desired result:
<body ng-app="plunker" ng-controller="MainCtrl">
<section>
<div ng-repeat="div in divs track by $index">
<div class="square"></div>
</div>
</section>
<button ng-click="add()">add</button>
</body>
section {
border: 1px solid red;
overflow: hidden;
padding: 10px 0;
width: 400px;
}
.square {
width: 100px;
height: 100px;
background: #000;
margin-right: 10px;
float: left;
margin-top: 1em;
}
Link to Plunker: