When using ngFor don't introduce line breaks

angular, css

Solution

Better would be to use `display: flex` on a wrapper element, and not use the ancient `float`:

html

<div class="images-wrapper">
    <div class="image-holder" *ngFor="let image of datasource">
        <img [src]="image.url">
    </div>
</div>

css

.images-wrapper {
   display: flex;
   flex-wrap: wrap;
}

.image-holder {
   padding: 2px; /*for white border around images*/
   height: 120px;
}

.image-holder img {
   height: 100%;
}

Check here for a cute working fiddle, no angular included, because this is mainly a css/html issue.

Problem

I have ngFor as follows: ``` <div class="image-holder" *ngFor="let image of datasource"> <img src="{{image.url}}" height="150" /> </div> ``` Here is the css: ``` .image-holder { display: flex; justify-content: space-between; } ``` This is what I have: This is what I want:

Original source