[SOLVED]Issue with CodePen Custom CSS

Hi Guys, I’ve tried searching for this issue, but didn’t see anyone with this specific problem.

I’m building the tribute page assignment on Codepen. I used quicklinks to enable Bootstrap. When I go to the CSS to customize my page. I’m getting inconsistent responsiveness to my CSS code. When I run an error check, it says “unknown property”. What confounds me, is that I could type the same thing into a different element below it, and it recognizes it just fine. Simultaneously, I could apply the code inline, and it works, if I cut and paste it into the CSS window, it stops working. Anybody know what I’m getting wrong here?

toggle “Analyze CSS” and you’ll see that it flags background-color in the body element but not in the .nav element.

****EDIT I noticed that CSS is picking up a space on some of the properties but not other. The system is picking my code as " background-color" rather than “background-color”. Note the space preceding the element. I have no idea how to keep that from happening.

A few things that I would point out:

  • Did you mean to add Bootstrap version 4 to the Pen? Some things might not work because of the version difference. I usually work with the 3.3.7 version, since it’s more complete and has all the documentation with examples.
  • I believe your nav element shouldn’t be inside the .container div. You put it outside, before the div.container and the rest.
  • Just a suggestion, but I don’t think you should use fixed values for elements, like that width: 1000px property. If you let it like that, it might stretch the page to the side in some resolutions.

I hope this helps. That aside, your code seems fine. :slight_smile:

I apologize if I misunderstood what your question is, but are you wondering why the background-color you applied to your body element is not visible? Or what are you trying to get the page to do?

thanks Jon, I didn’t notice it was bootstrap 4. That was what came up. Is there a way to change it to 3.7?

and with that width, I was trying to see if CSS was responding to my input, I wasn’t going to keep it.

jv888899

I’m simply trying to change background color via CSS. For some reason the CSS recognizes my code with a space preceding the actual property " background-color" with the space preceding the b. This is despite the fact that I’ve typed it no differently then the inputs below it.

***Thanks Jon, I changed the CSS manually to the 3.3.7 CDN and I stopped relying on the auto complete from CodePen that fixed the issue.