# 10.6: Inbox / Outbox Template

## Adding Inbox / Outbox Template

Again, this is going to be very similar to other templates like `MemberList` and `Followers`.

Take a look at what's going on and see if you understand everything. If not, review previous modules.

Next, we'll add some styling to `messages.component.scss`:

```css
.content {
    width: 40%;
}

.info {
    width: 20%;
}

.table, .table-hover {
    cursor: pointer;
}

.rounded-circle {
    max-height: 50px;
}
```

Open up the browser and verify that it is working correctly.

![Inbox/OutboxWorks](https://122480229-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAU8YfVcpLNVPaSQtyc%2F-LAU8fPjgm_DRb3Jf3Aw%2F-LAU8u-5sFxxfpwMYEir%2Finboxoutboxworks.png?generation=1524162340695047\&alt=media)

If you click on one of the messages, you should be taken to the user's details page. That is working correctly. However, we'd also like for the `Messages` tab to be open instead of the `About` tab. We'll fix that next.
