```css
    #myid{
        border:1px solid black;
    }

    #myid code {
        border:1px solid black;
     font-size: 1.5em;
     line-height: 3em;
     vertical-align:top;
    }
```

```html
    <main>
     <p id="myid">trying to understand <code>vertical-align</code> better.</p>
    </main>
```

Why does the code box not align to the top of the surrounding p box?