How can I show html object that is behind a fixed element?

Question

I have created a top navigation with these styles below:

div.topnav
{
    position: fixed;
    width: 100%;
    height: 50px;
    display: inline-block;
}

And I want to render a

object, but that is being displayed behind my top bar, check it out on the image below:

What can I do to fix this?

Answer 1

From the image you provided I believe that what is happening is that your <p> is being rendered behind your topbar

if you add something like:

p {
  margin-top: 60px;
}

you should be able to see it!

I'm using 60 because it would be 50 from the topbar height + 10 for a small padding