store contents in views and delete whitespace that are appearing

0

I'm having the problem of listing elements in my views, these elemntos should appear together with no blanks to separate them. To solve this issue I tried to use masonry, without success, and I have no idea how to make this arrangement!

<div id="services">
   <div class="box" ng-repeat="service in services">
       <div class="col-5">
          <a class="service-card"  href="{{ service.url }}">
            <h3>{{service.name}}</h3>
                <p ng-bind-html="service.description | limitTo:150 " ><p>{{service.description.length >=   150  ? "..." : " "}}</p><p class="btn">ver mais</p></p>
                <span ng-repeat="category in service.categories">{{ category.name }}.</span>
            </a>
        </div>
    </div>
</div>

This code snippet that is responsible for controlling the appearance of elements in views. Thank you for your attention!

    
asked by anonymous 19.04.2016 / 20:26

1 answer

0

Unfortunately I did not have any help here, thankful for the correction made in the formatting of the code that I exposed. So that the same case that I asked is left with solution I will post the solution that I found.

<div class="grid" data-masonry='{ "itemSelector": ".grid-item", "columnWidth": 200 }'>
   <div class="col-6" style="width: 250px;height: 350px; padding: 0;margin: 0;text-align: center;" ng-repeat="service in services">
	  <a class="service-card" href="{{ service.url }}">
		<h3 class="title" >{{service.name}}</h3>
		<p ng-bind-html="service.description | limitTo:150 " style="list-style: none;margin: 24px;display: inline-block;font-size: 2em;" ><p>{{service.description.length >=   1 	? "..." : " "}}</p><p class="btn">ver mais</p></p>
	    <span ng-repeat="category in service.categories">{{ category.name }}.</span>
	</a>
  </div>
</div>

Now, this code can list the elements and eliminate the blank holes that appeared!

    
20.04.2016 / 15:35