[FIXED] Angular styles problem (primeng – primeflex)

Issue

I am using primeflex, and in begin all go good, but now… i dont know what happen. Suddenly breaks.

This styles arent catching by the elements of the html.

The first example of grid system dont work:

<div class="p-grid">
<div class="p-col-4">4</div>
<div class="p-col">1 </div>
<div class="p-col">1 </div>
<div class="p-col">1 </div>
<div class="p-col">1 </div>
<div class="p-col">1 </div>
<div class="p-col">1 </div>
<div class="p-col">1 </div>
<div class="p-col">1 </div>

enter image description here

But, 1 hour moving the css to one site to another, i notice that the css is really there. I try this, changing the selector:

enter image description here

And magic, begin to work:

enter image description here

That selector, the "p-X" is the problem.

I suppose some in my modules, my angular or something miss some configuration. But dont know what. This is a project test, i will make another one from the beginning, but will be usefull to know what happen when the real project launch.

I can give the other code (angular.json, modules and that…) but i think that the problem isnt there (its works yesterday).

Solution

I confirm that the problem is the version of primeflex.

The new version (3.0) uses another names for the selector classes (col-X). In (2.0) uses other (p-col-X).

The link of the documentation in primeng are both (3.0 and 2.0, care looking). This is 3.0:

https://www.primefaces.org/primeflex/gridsystem

Thanks to Alba.

Answered By – Pevi

Answer Checked By – Clifford M. (Easybugfix Volunteer)

Leave a Reply

(*) Required, Your email will not be published