title: 2 pixel line different color beside text css
body: <p>Is a simple exercice, probably some solution better than others, but I wonder which is the best to create this kind of structure in html and css:</p>
  
  <p>What I want is the text, then create 2 pixel line, 1px red and other 1 px green. </p>
  
  <p><img src="https://i.stack.imgur.com/wDEpS.png" alt="enter image description here"></p>
  
  <p>Not sure what is the best solution for crossbrowser , want to lines end same time.</p>
  
  <p>Already tried with border, hr , background .. but seems not perfectly finish.</p>
  
  <p>ps-looking for a solution without recurring to a image </p>