Primeng grid does not work

Question

I am using several components of primeng normally as buttons, inputs, menu, etc. All working normally in my design at angular 10. Except the grid is simply not organizing anything on the screen, for example:

<div clas="ui-g">
<div clas="ui-g-8">
<h1>1<\h1>
<\div>
<div clas="ui-g-2">
<h1>2<\h1>
<\div>
<div clas="ui-g-2">
<h1>3<\h1>
<\div>
<\div>

It was to be distributed on the screen as follows:

However the grid is the only thing that does not work, I do not know if it was very clear. But if someone has been through this, I ask for help.

Answer 1

Grid Is Obsolete in Angular Primeng instead use Flexgrid
Install Flexgrid

npm install primeflex --save

Add the in your "Styles" of the.json angular file

"node_modules/primeflex/primeflex.css"

and in your app.component.html flexGrid will look like this

    <h3>FlexGrid</h3>
    <div class="p-grid">
        <div class="p-col-8">
            <div class="box">1</div>
        </div>
        <div class="p-col-2">
            <div class="box">2</div>
        </div>
        <div class="p-col-2">
            <div class="box">3</div>
        </div>
    </div>