Map doesn't show in browser using map components, calcite components with Angular.

[ForrestLin]

I'm working on website using map components, calcite components with Angular.

I create a angular component "esri-map" with arcgis-map

esri-map.component.html:

 <arcgis-map item-id="cece49703cc24b0783dffb3032b0679c"></arcgis-map>

I put it in <calcite-shell>:

app.component.html:

<calcite-shell>

    <app-esri-map ></app-esri-map>

 </calcite-shell>

The map doesn't show in browser. 

 I inspect the document:

[ReneRubalcava]

If you could provide a repro to look at, would be easier to see the problem. If I had to guess, your `<app-esri-map>` element needs a height and width in css. The `<arcgis-map>` component will grow to the size of it's container, so the container probably doesn't have them.

[ForrestLin · Accepted solution]

@ReneRubalcava 

You are right!  

`<app-esri-map>` element needs a height and width in css:

app-esri-map {

  padding: 0;

  margin: 0;

  height: 100%;

  width: 100%;

}

It works!

Thank you so much!

Forrest