Vuetify Container max-width fixed

Super Simple Answer: It's similar to the answer above but includes width:100% in the style; as mine didn't work without it.

<template>
     <v-container fluid style="margin: 0px; padding: 0px; width: 100%">
          <v-layout wrap>
               <div class="container">
                    Content you want in a container as this takes on the container class.
               </div>
               <div>
                    Content you don't want contained as it takes on the fluid 100% width. 
               </div>
          </v-layout>
     </v-container>
</template> 

Basically, you override the entire default v-container with a width of 100%.

The concept of containers is very common among website layouts. By default, Vuetify uses a 'fixed' container. A 'fluid' container will fill the viewport.

You can set the fluid prop to true on your Vuetify container <v-container>:

<div id="app">
  <v-app>
    <v-content>
      <v-container fluid ma-0 pa-0 fill-height>
        <v-layout row>
          <v-flex xs4> Chat List </v-flex>
          <v-flex xs4> Main Chat</v-flex>
          <v-flex xs4> User Profile</v-flex>
        </v-layout>
      </v-container>
    </v-content>
  </v-app>
</div>

Here is some helpful information about fixed vs fluid containers: https://www.smashingmagazine.com/2009/06/fixed-vs-fluid-vs-elastic-layout-whats-the-right-one-for-you/

Additional Vuetify grid information can be found here: https://vuetifyjs.com/en/layout/grid