[FIXED] PrimeNg grid system is not working as per the documentation


I am using PrimeNG in my application and have installed all the required dependencies as per the official documentation. I am trying the example of the grid system available on their website and it’s not working.

Here’s the code:

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

Here are styles in my angular.json file

"styles": [

It’s printing all these three lines vertically (in a single column) but, as per the documentation it should print it in a single line i.e, horizontally (in 3 different columns). I am using Angular 12+ and running my app over Nx CLI. Any help would be appreciated!Thanks


They removed the p- prefix for primeflex classes in the most recent version (3.x).

See here for the migration path.

See here for the latest docs.

Answered By – R. Richards

Answer Checked By – Clifford M. (Easybugfix Volunteer)

Leave a Reply

(*) Required, Your email will not be published