title: how do I make fixed text
body: <p>In my web page I have some paragraphs some can occupy a max width of 300px, others are just one line of text without width limit, I set the font size to 12px, but when I zoom out the text on the paragraphs with a limit width expands downwards and the ones who don't have a limit expand sideways. Can someone help me? If possible could you explain why it happens?</p>
  
  <p>Ok, now that I have access to my computer here's the code</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="mgd"&gt;
      &lt;p&gt;Mobile group decision making platform.&lt;/p&gt;
  &lt;/div&gt;
  
  &lt;div  class="firstdesc desc"&gt;
              &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.Ut enim ad minim veniam&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>.mgd{
    text-align:left;
    font-family: Lucida Sans Unicode;
    font-size: 12px;
    color: white;
    position: absolute;
    top: 46.28571428571429%;
    left: 31.57894736842105%;
  }
  
  .desc{
    position: absolute;
    font-family: Lucida Sans Unicode;
    color: white;
    width:300px;
    overflow:hidden;
    max-height:60px;
    font-size:12px;
    text-align: justify;
    top:53.97727272727273%;
  }
  .firstdesc{
    left:23.94736842105263%;
  }
  </code></pre>