Narrow screens don't like the top banner

The very fancy top banner looks like it is a fixed width so with a narrow screens you end up with a horizontal scroll bar:

It’s a minor annoyance rather than a big issue.

1 Like

If you set width: 100% and unset height it will scale down and up (to its normal maximum) quite nicely:


it’s exactly the same size as the previous Anniversary one that was here for months without any problems !!

1 Like

Could be, I just didn’t notice it before. :slight_smile:

I’m rechecking it, maybe something is wrong !

EDIT : which is your screen size? 1024x768px ?
Could you try now ?

1 Like

What banner?

Not that I would ever suggest anyone would want to use, for example, uBlock Origin to block the banner, but if one was so inclined, one could.



Same thing with Chromium and Firefox 82a. :frowning_face:

What are you using to test and I can see if I can replicate?

The width is defined 100% and there is no height…
i tested on Firefox 80.01 / Safari / Chromium Version 85.0.4183.83

1 Like


Here in resolution 1360 x 768 it works without problems.

1 Like

I can see that the height setting has gone, but I don’t see the width being active (with plenty of page reloads to try and clear cache etc.).

If I remember correctly, depending on where the setting is changed it might need a container rebuild to take effect (so the SASS etc. is recompiled)… :confused:

Mobile is working also…

Yep with Discourse it’s not as you want, it’s a container.

1 Like

I can see width: 100% on the parent div,

I don’t know if that was there before… :confused:

To confirm, it happens for me whenever the window width is below 1091px, the image is wider than the containing div:

I have 1360 X 768 also and it works at full screen width.
To see what is being referred to, in the upper right where the minimize, resize/fullsize, and exit buttons are. Click on resize/fullsize and make the window narrower. At some point the banner will be truncated.



Yep about Display is hard to satisfy everybody.
The banner is 1100x60px then I’m trying to make it work for maximum of displays resolutions.

Desktop Screen Resolution Stats Worldwide - Juil 2019/Juil 2020
1366x768 = 23.27%
1920x1080 = 20.53%
1536x864 = 8.47%
1440x900 = 6.55%
1280x720 = 4.73%
1600x900 = 4.19%

I would need some test on mobile !! i did one special for @Pudge :wink:


Yes, the banner is perfectly fine and looks lovely as it is. :wink:

It just needs a tweak to something in the Discourse theme to set the CSS width property so it will scale down when the window narrows to less than 1100px.


The mobile version, for me at least, has a portion of the banner lengthwise duplicated, added to said banner and all of that is centered.

The phone screen is 1080x1920 and I’m viewing the forum through Firefox.

1 Like

Thanks for testing mobile ! :wink:

Yes, on the right, the behavior on Discourse is not the same as doing a white page in the sense the existing code override your code… here it’s done as center width 100%, then I added the same image as background to resolve this wrong behavior…

We want to limit the use of plugin for this, they are sources of problems during update on Discourse…