CSS question: banner on starting page

[lostintime (Alexandra)]

Hi everyone,

I have a banner for new visitors on the front page of my community.

This is the CSS I have under “Desktop”:

body[class*="category-"] #banner {
    display: none;
}

 #banner { /* white background */
    
    background-color: rgb(255, 255, 255);
    background-image: url("/uploads/db6165/original/1X/daab75c27e6811c862d2b159c97e934e93b33c9e.png");
    background-repeat: no-repeat;
    padding-left: 520px;
 }

Now the thing is that the banner image gets split in two, so that the top half shows above the extra menu I have at the top (the dark blue area) as can be seen in this screenshot:

Does anyone have any tipps as to how avoid this?

Thanks!
Alexandra

[joffreyjaffeux]

hi @lostintime,

I tried to reproduce this but couldn’t. I think something else is the cause of your issue:

I suspect you have added a <div id="banner"></div> in your theme when you don’t need to, as this div will be automatically created when you pin a topic as a banner topic.

[lostintime (Alexandra)]

That’s brilliant, Joffrey, thanks!

There was indeed a “loose” <div id="banner"> in my header CSS.
Once I got rid of it, everything looked as it should

Thanks again!