Codepen isn't displaying my code as it seemingly should

Hi everyone, I’m new here. I’m currently working on the first project- building a tribute page. I built my project in notepad ++ using bootstrap 4, then copied and pasted the code (the entire body into the html section, and all the css into the css section) over into codepen. However when I click run, my tribute page isn’t displaying as it does when I run it from notepad++. I’ve made sure that bootstrap 4 is working on my codepen, so I’m really at a loss as to why it’s not displaying as expected. I want the #left column, which consists of the text “Carl Sagan”, a picture, and an embedded youtube video, to be in a fixed position on the left, while the right column, which consists of text, should be on the right. Major thanks to anyone who’s able to help me out. There’s a media query in there too.

You may want to use “z-index”.

    #left {
        position: fixed;
        top: 0;
        bottom: 0;
        z-index: 99999;

Thank you so much, I’ll try that :slight_smile:

1 Like

I’ve tried adding the z-index, but it’s still not displaying correctly. I’ve got a media query to fix the left colum in a fixed position , so that it doesn’t move while the right column scrolls, for viewports with a width of min. 576px. It runs fine on chrome, but from codepen it’s not quite right. Anyone have any idea why this could be?

By the way…you don’t add scripts in JS… <script> is a HTML tag.

body {
background: radial-gradient(#f2f2f2 0%, #d6d6d6 100%)

h1 {
img {
  display: block;
  margin: 0 auto;

That’s all the CSS and its working pretty good for me…if that’s not what you want. Maybe a little sketch will help.

You’re right, seems I didn’t even need the media query… I have no idea how, but I seem to have tricked myself into thinking that it was needed, and the fact that it was displaying differently on code pen to how it does when I open it on chrome or IE on my laptop threw me off… Anyway, thank you so much for your help. I was starting to go a little crazy! :joy:

1 Like