title: Text positioning in CSS, HTML
body: <p>I want to position paragraphs like shown in an example</p>
  <p><a href="https://i.stack.imgur.com/I6QA7.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/I6QA7.jpg" alt="example" /></a></p>
  <p>What could be the best way to do that? I tried to to something with first paragraph but it doesn't seem to work. It seems to be an easy solution but I want to find what's the best way, so code is clean and easy to read. Here's what
  I have at this point</p>
  <p>my work</p>
  <p><a href="https://i.stack.imgur.com/h26hO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/h26hO.png" alt="enter image description here" /></a></p>
  <p>Any help is appreciated.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>         .fotke1 {
              
              border-top: 8px solid #029794;
              position: relative;
              float: right;
              right: 30px;
              top: -30em;
              border: none;
            }
            .sarasas {
              background-color: #EEE8AA;
              width: 220px;
              height: 220px;
              float:right;
              
  
            }
  
            #privalumas1 {
              font-size: 14px;
              margin-top: -20px;
              margin-bottom: -10px;
              
              padding: 0px;
            }
            #trukumas1 {
              font-size: 14px;
              margin-top: -9px;
              
              padding: 0px;
             
            }
           h3 {
              font-size: 17px;
               
           }
           .privalumai {
               margin-left: 12px;
               margin-top: -12px;
               font-size: 15px;
           }
           .trukumai {
              margin-left: 12px;
              margin-bottom: -12px;
              margin-top: -12px;
              font-size: 15px;
           }
           .kainos {
               font-size: 14px;
               margin-top: -9px;
               margin-left: 12px;
           }
           p.lyjant {
               width: 380px;
               word-break: normal;
               
           }
  
           .fotke2 {
              
              border-top: 8px solid #029794;
              position: relative;
              float: right;
              right: 30px;
              top: -30em;
              border: none;
            }
            #privalumas2 {
              font-size: 14px;
              margin-top: -20px;
              margin-bottom: -10px;
              
              padding: 0px;
            }
            #trukumas2 {
              font-size: 14px;
              margin-top: -9px;
              padding: 0px;
            }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="autoriai"&gt;
              &lt;p&gt;&lt;a href="mailto:webmaster@example.com"&gt;Audrius Vaičiūnas&lt;/a&gt;&lt;br&gt;
                 &lt;a href="mailto:webmaster@example.com"&gt;Linas Babrauskas&lt;/a&gt;&lt;/p&gt;
              &lt;/div&gt;
  
              &lt;div&gt;
                  &lt;p class="lyjant"&gt;text1&lt;/p&gt;
              &lt;h3&gt;„ATI Radeon 9800 XT“ ir „9600 XT“ &lt;/h3&gt;
              &lt;p&gt;text2&lt;/p&gt;
                  &lt;/div&gt;
         
          
                  &lt;div class="fotke1"&gt;
  
             
              &lt;img src="9800.jpg" height="220" width="255" atl="ASUS Radeon 9800"/&gt;
  
              &lt;div class="sarasas"&gt;
                  &lt;a href="https://www.asus.com/lt/Graphics-Cards/A9600XTTVD128M/" target="_self"&gt;&lt;/a&gt;&lt;h3&gt;ASUS Radeon 9800 XT/TVD&lt;/h3&gt;
                  
              &lt;p class="privalumai"&gt;&lt;b&gt;Privalumai:&lt;/b&gt;&lt;/p&gt;
              &lt;div id="privalumas1"&gt;
              &lt;ul&gt;
  
                  &lt;li&gt;puikūs našumo rezultatai&lt;/li&gt;
  
                  &lt;li&gt;vaizdo signalo įvesties ir išvesties funkcijos&lt;/li&gt;
                  
                  &lt;li&gt;puiki programinė įranga, daug priedų &lt;/li&gt;
              &lt;/ul&gt;
              &lt;/div&gt;
              
                 &lt;p class="trukumai"&gt;&lt;b&gt;Trūkumas&lt;/b&gt;&lt;/p&gt;
                 &lt;div id="trukumas1"&gt;
              &lt;ul&gt;
                  &lt;li&gt;didelė kaina&lt;/li&gt;
              &lt;/ul&gt;
              &lt;/div&gt;
              &lt;div class="kainos"&gt;
              &lt;p&gt;&lt;b&gt;Kaina&lt;/b&gt; 1 949 litai&lt;br&gt;&lt;b&gt;Bendrovė&lt;/b&gt; "Mikrodata"&lt;/p&gt;
          &lt;/div&gt;
          &lt;/div&gt;
          &lt;/div&gt;
  
  
  
          &lt;div class="fotke2"&gt;
              &lt;img src="9600.jpg" height="220" width="255" alt="ASUS Radeon 9600"/&gt;
              &lt;div class="sarasas"&gt;
              &lt;a href="https://www.asus.com/lt/Graphics-Cards/A9600XTTVD128M/" target="_blank"&gt;&lt;/a&gt;&lt;h3 class="9600"&gt;ASUS Radeon 9600 XT/TVD&lt;/h3&gt;
        
              &lt;p class="privalumai"&gt;&lt;b&gt;Privalumai:&lt;/b&gt;&lt;/p&gt;
              &lt;div id="privalumas2"&gt;
              &lt;ul&gt;
  
  
                  &lt;li&gt;labai geri našumo rezultatai&lt;/li&gt;
  
                  &lt;li&gt;vaizdo signalo įvesties ir išvesties funkcijos&lt;/li&gt;
                  
                  &lt;li&gt;puiki programinė įranga, daug priedų &lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
                  &lt;p class="trukumai"&gt;&lt;b&gt;Trūkumas&lt;/b&gt;&lt;/p&gt;
                  &lt;div id="trukumas2"&gt;
                  &lt;ul&gt;
                  &lt;li&gt;didelių trūkumų nepastebėta&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div class="kainos"&gt;
              &lt;p&gt;&lt;b&gt;Kaina&lt;/b&gt; 699 litai&lt;br&gt;&lt;b&gt;Bendrovė&lt;/b&gt; "Mikrodata"&lt;/p&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>