HTML <pre> tag add empty line

Question

I have a question about the pre tag in HTML. My code looks the follow

<pre>
 User              |   Account              |   Active
 ----------------------------------------------------------------          
   Tim             |    1234                |    yes
   Bob             |    0346                |    yes
   Adams           |    1765                |    no
   Gig             |    0045                |    yes
</pre>

but as output i have

 User              |   Account              |   Active

 ----------------------------------------------------------------  

   Tim             |    1234                |    yes

   Bob             |    0346                |    yes

   Adams           |    1765                |    no

   Gig             |    0045                |    yes

there is an empty line in between of each line in the tag.

My css looks like: pre { overflow-x:scroll}

i have also tried display:inline but does not work.

Can someone please help me to remove the empty line in the output? Thanks :)

Answer 1

对我有用的是设置line-height样式属性：

   pre {
      line-height: 100%;
      overflow-x: scroll;
   }