CDK overlay auto calculate width when using ConnectedPositionStrategy

#### Bug, feature request, or proposal:
Feature

#### What is the expected behavior?
That i can somehow configure the popup overlay to change it width to be the same as the parent, without having to add a bunch of custom styling to my popup component.

#### What is the current behavior?

#### What is the use-case or motivation for changing an existing behavior?
I would have to do less custom styling to get a nice dropdown

#### Is there anything else we should know?
In the screenshots we have changed the width using css, however this is suboptimal to having a responsive design, where the input can change their width all the time.
To get around the problem we have to hard-code the width of both the input and the popups, so they look to fit together.

My best suggestion would be able to do something like this:

```typescript
this.overlay.position()
.connectedTo(target, {
originY: 'bottom',
originX: 'start'
}, {
overlayY: 'top',
overlayX: 'start'
})
.immitateWidth();
```

Bắt đầu với API CDK overlay ConnectedPositionStrategy và tái hiện trường hợp chiều rộng responsive được mô tả trong issue. Được xem là hoàn tất khi một popup được kết nối có thể khớp với chiều rộng của phần tử cha khi phần tử cha thay đổi, mà không cần styling tùy chỉnh trên component popup; báo cáo không nêu file nguồn hoặc test cụ thể nào.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.