To Avoid Components Overlapping in Angular

To Avoid Components Overlapping in Angular

I have two components called customer-details and customer-bookings which are called by their selectors in app.component.html file as shown in below code

     <app-customer-details></app-customer-details>
     <app-customer-bookings></app-customer-bookings>

The components should look like this(i,e one below the other).

But it is overlapping like this.

Here i am facing overlapping issues,I tried to solve it by setting height to 50vh for each component. But i want to solve this overlapping issue without setting the height manually.

Here is the stackblitz link.

2

2 Answers

You should remove this from your table style:

position:absolute;

in customer-details.component.css

Noting to do with the component. Just modify the CSS.

table{
  /* position:absolute; */
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Alexander Ross
Author

Alexander Ross

Alexander Ross has covered the video game industry for a decade, writing deep dives on game design, esports tournaments, VR developments, and gaming culture.