I’ve been having the damnedest time getting my ::after pseudo element to work. I posted a thread here a couple days ago when my ::after wasn’t working when trying to position a bottom border on my header div (it has a background image set, but it’s not an image element) and it somehow magically started working. Since I imported my custom fonts to my site via @font-face, they quit working and won’t work even if my @font-face is commented out. Now I can’t get it to work unless my position is set to fixed, which does not solve my problem because it fixes to the bottom of my browser window! I’ve played around with everything from the z-index positioning to various display settings and position settings. I have no clue what I’m doing wrong because my code looks correct with everything I’ve been reading.

Here’s my current CSS and HTML I grabbed from my Page Source via Chrome Dev tools with the position:fixed; that makes my border show up:

I have coding in Sass as well and uploading my compiled CSS file to my development server, so maybe that makes a difference? Maybe it’s something with Visual Composer?

I’ll try to respond to any questions with as much detail as possible.

Note: Yes, the links to my background images are correct, but I have changed the name of my company to “mywebsite” and the subdomain of my client to “dev” due to posting the questions on here. I added background colors because that’s what a couple of the helpful StackOverflow members did on my last question.