title: Postions of Divs in Desktop and mobile view
body: <pre><code>        &lt;div class$="{{_classForListWrapper(filtered)}} conversation-section"&gt;
            &lt;div id="convo-list-wrapper" class="conversation-list"&gt;
                &lt;gm-conversation-list language-code="{{languageCode}}"                   
                                      first-result="{{firstResult}}"
                                      results="{{results}}"&gt;
                &lt;/gm-conversation-list&gt;
            &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;template is="dom-if" if="{{!filtered}}"&gt;
              &lt;div id="convo-tags-wrapper"class="col-md-9 col-lg-8 conversation-chatbox"&gt;
                &lt;template is="dom-if" if="{{openConversation}}"&gt;
                  &lt;gm-conversation
                    id="conversation1"
                    conversation="{{conversation}}"
                    show-tool-tip="{{showToolTip}}"
                    tool-tip-step="{{toolTipStep}}"
                    base-url="{{baseUrl}}"
                  &gt;&lt;/gm-conversation&gt;
                &lt;/template&gt;
            &lt;/div&gt;
          &lt;/template&gt;
  </code></pre>
  
  <p>I have left div and right div in desktop view. Left div has chat list. Right div has one selected chat details. (The chat Selected from left chat list div) In mobile view, it should display Left chat list div. After selecting the specific chat from the chat list div(Left div) it should display the selected chat details in separate mobile UI. Please help me to explain with simple code.</p>