title: Aligning divs in relation to other divs
body: <p>I'm trying to replicate something like this: <img src="https://i.imgur.com/eNZie1Gg.png" alt="Text">.</p>
  
  <p>The red div (the container) is centered horizontaly and hasn't a fixed width. The "title" div inside it should set the width of the container by being the widest div inside it, and the "welcome to" and "subtitle" divs are attached to the "title" div and the left/right of the container.</p>
  
  <p>I'm struggling to understand how I can put my "welcome to" div to the left, before having set the "title" div which gives the width of the container.</p>
  
  <p>For the moment, I have this code:</p>
  
  <pre><code>.container {
  text-align: center;
  }
  
  .welcome_to{
  text-align: left;
  }
  
  .subtitle{
  text-align:right;
  }
  
  .title{
  }
  </code></pre>
  
  <p>It centers the title div, but put the other divs at the edges of the screen, and not of the container.</p>