nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Custom HTML Banner in Confluence Server making causing [Update] button (div) to be hidden

Darryl Lee

Hi - Confluence Server 7.13.0. I've been inserting announcement banners on the site just like always: How to add a site-wide banner

Users noticed something odd last time around. When editing a page, the div for the banner appears to be causing the div for "savebar-container" (which contains the [Update] and [Close] buttons) to not show up.

Scrolling down with a mouse or touchpad can make it appear, but it's an annoyance.

Any ideas? I did try adding extra height to a custom footer but that didn't seem to help.

I'm thinking there's some CSS fix for this, but it's certainly beyond me.

Accepted answers

Rilwan Ahmed

@Darryl Lee ,

Please try this

Custom HTML  --> At beginning of the BODY


<div class="aui-message warning" style="text-align:center">
Your Message Here
</div>

All comments

Fabian Lim

Hi @Darryl Lee

Can you share your banner with the formatting to see if we can reproduce it?

Cheers

Pramodh M

Hi @Darryl Lee

How about we use announcement banner in MARKDOWN Format?

Or format the announcement banner as given in the doc below

https://confluence.atlassian.com/confkb/how-to-add-a-site-wide-banner-165609599.html

They have also mentioned in the note about scrolling down to see the footer!!

Let me know what you think about it?

Thanks,

Pramodh

Darryl Lee

Heh, no Markdown does not work for Banners. Screen Shot 2022-01-26 at 8.16.42 PM.png

Darryl Lee

Oooh, good idea. Here was my banner:

<!-- Message Banner -->
<div style="background-color: yellow; border: 2px solid red; margin: 4px; padding: 2px; font-weight: bold; text-align: center;">
CONFLUENCE STAGING
</div>
<style type="text/css">
#com-atlassian-confluence #main {
padding-bottom: 200px;
}
</style>

So that's pretty much straight out of the the Atlassian docs with the addition about footer size.

I wonder if it might be browser-specific. I'm seeing it in the Chrome variant Brave, and I believe my users were also using Chrome.

Darryl Lee

Here's what a Create Page looks like with the banner above vs without, before I touch the mouse to scroll.

WITH:

WITHOUT:

Fabian Lim

Hi @Darryl Lee

Not sure what you are trying to accomplish with the footer padding. I don't think it belongs in the announcement banner.

We use the following and we have no issues in our banner and looks cleaner.

<div class="aui-message warning">
<p class="title">
<span class="aui-icon icon-warning"></span>
<strong>Jira Maintenance:</strong> We are currently running performance tests. DO NOT Change any configurations!.
</div>

Rilwan Ahmed

@Darryl Lee ,

Please try this

Custom HTML  --> At beginning of the BODY


<div class="aui-message warning" style="text-align:center">
Your Message Here
</div>

Bill Bailey

If you are using what was suggested in the article:

<div class="aui-message closeable">

I would suggest adding a custom class to the div tag to allow you to control the format that way. You may have a conflict between your styling and the default aui-message.

I also suggest NOT using inline sytling, but adding the code to your site's CSS.

Pramodh M

Oops My bad, but I did a testing on the version exact to your version and I did not get any error

Try adding it to the body

<!-- Message Banner -->
<div style="background-color: yellow; border: 2px solid red; margin: 4px; padding: 2px; font-weight: bold; text-align: center;">
Your important message...
</div>

Thanks

Darryl Lee

Hi thanks @Pram - can you watch my video below:

https://photos.app.goo.gl/LtCqMHPbfBYMG2nA6

If you edit an existing page with enough content that you need to scroll through it, does the "Savebar" stay pinned at the bottom of the window?

Darryl Lee

Barbara @ Atlassian Support figured it out for me!

I had my banner in the wrong place "At the end of the HEAD" instead of "At beginning of the BODY".

They figured that out without me telling them I had it in the wrong place. Amazing!

Once I moved my banner to the right place (which is where the documentation says to put it. DOH!), it worked just fine!

Rilwan Ahmed

@Darryl Lee

I had given my suggestion. Seems you did not see it in my earlier comment.

Darryl Lee

Ah yes didn't see that. Thanks.

Darryl Lee

Thanks yes as I mentioned below,

Barbara @ Atlassian Support figured out that I had my banner in the wrong place "At the end of the HEAD" instead of "At beginning of the BODY".

Once I moved my banner to the right place (which is where the documentation says to put it. DOH!), it worked just fine!

Welcome!

It looks like you're new here. Sign in or register to get started.

Quick Links

Find more posts tagged with

confluence

server

confluence-server