specific vertical line

by Cem Firat

HTML

<!DOCTYPE html>
<html>

  <head>
    <style>

    </style>

  </head>

  <body>

    <div class="main">

      <div class="headline inline_block">
        &nbsp<span class="line_nummber">1</span>
        <span class="level">&nbsp</span>
        &#60;

        <h1 class="blue inline_block">!DOCTYPE PORTFOLIO</h1>&#62;
      </div>

      <!-- html -->

      <div>
        &nbsp<span class="line_nummber">2</span>
        <span class="level">&nbsp</span>

        <p class="inline_block">&#60;html&#62;</p>
      </div>

      <div class="end">
        &nbsp<span class="line_nummber">3</span>
        <span class="level vertical_line">&nbsp</span>
      </div>

      <!-- head -->

      <div>
        &nbsp<span class="line_nummber">4</span>
        <span class="level vertical_line">&nbsp</span>
        <span class="level">&nbsp</span>

        <p class="inline_block">&#60;head&#62;</p>
      </div>

      <div class="end">
        &nbsp<span class="line_nummber">5</span>
        <span class="level vertical_line">&nbsp</span>
        <span class="level vertical_line">&nbsp</span>
      </div>

      <div>
        &nbsp<span class="line_nummber">6</span>
        <span class="level vertical_line">&nbsp</span>
        <span class="level vertical_line">&nbsp</span>
        <span class="level ">&nbsp</span>

        <p class="inline_block">&#60;title&#62; Alexander's Portfolio &#60;/title&#62;</p>
      </div>

      <div class="end">
        &nbsp<span class="line_nummber">7</span>
        <span class="level vertical_line">&nbsp</span>
        <span class="level vertical_line">&nbsp</span>
      </div>

      <div>
        &nbsp<span class="line_nummber">8</span>
        <span class="level vertical_line">&nbsp</span>
        <span class="level">&nbsp</span>

        <p class="inline_block">&#60;/head&#62;</p>
      </div>

      <!-- end head -->

      <div class="end">
        &nbsp<span class="line_nummber">9</span>
        <span class="level...

CSS

* {
            font-family: monospace;
        }

        p {
            margin: 0;
        }

        h1,
        .headline {
            font-size: 2em;
            font-weight: bold;

        }

        .inline_block {
            display: inline-block;
        }

        .line_nummber {}

        .blue {
            color: #0087ca;
        }

        .level {
            display: inline-block;
            min-width: 1vw;
        }

        .vertical_line {
            border-right: 1px solid black;
        }