Unable to add any CSSS to page without navbar formatting errors

Sadie Stokes May 6, 2024

I am trying to use custom css on my confluence space and when adding anything or even adding a link to a blank stylesheet the navbar completely loses its formatting. This only happens on one of my spaces but not sure what the issue is. For example if I add just the following to my space tools stylesheet:

#aui-header{

background-color: black;

}

it makes the change to the header but it completely removes the formatting of the navbar which means I can't change anything.

Can anyone help?

1 answer

0 votes
Brant Schroeder
Community Leader
Community Leader
Community Leaders are connectors, ambassadors, and mentors. On the online community, they serve as thought leaders, product experts, and moderators.
May 6, 2024

@Sadie Stokes Welcome to the Atlassian community

Can you share some screenshots of how you are implementing the change?  Also are you using an app, if yes which one?

Sadie Stokes May 8, 2024

yes here is my navbar without formatting, text looks and behaves normally. And below that is when I add the background color to the devheader. I change nothing else and it throws off the entire navbar.

No other apps being used, just making a change in the stylesheet.

withoutformatting.pngcssformatting.png

Brant Schroeder
Community Leader
Community Leader
Community Leaders are connectors, ambassadors, and mentors. On the online community, they serve as thought leaders, product experts, and moderators.
May 8, 2024

@Sadie Stokes I was able to apply the following without any issue:

#header .aui-header {background-color: #000; color: #fff; }

If you use that CSS and type it in what happens?

Sadie Stokes May 8, 2024

@Brant Schroeder same result. It does change the background color but the navbar still gets all wonky like it does above. Literally no matter what I change or if I just add a link to the stylesheet with nothing in it, the navbar messes up.

Brant Schroeder
Community Leader
Community Leader
Community Leaders are connectors, ambassadors, and mentors. On the online community, they serve as thought leaders, product experts, and moderators.
May 8, 2024

@Sadie Stokes Is this happening on all spaces?

Sadie Stokes May 8, 2024

In every other spaces I own or try to edit recently, yes, but for others spaces that had formatting before they seem to be fine. I am not sure if they made edits recently.

I feel like this may be an issue with our instance of Confluence but I'm trying to pinpoint the issue to bring back to my internal support team.

Brant Schroeder
Community Leader
Community Leader
Community Leaders are connectors, ambassadors, and mentors. On the online community, they serve as thought leaders, product experts, and moderators.
May 8, 2024

@Sadie Stokes I would agree that it is something with you instance.  If you inspect the page after you add the CSS to the space do you see any errors?  Do you have a test instance, is it happening there?

Sadie Stokes May 8, 2024

this is the only error I see in the console, but I see this with or without the css added:

consoleerrors.png

As a workaround could you guys provide us with the css needed to reformat the navbar or would the only solution be to figure out the issues in our instance? And if so can you point me to what might help so I can relay that back to my team?

Brant Schroeder
Community Leader
Community Leader
Community Leaders are connectors, ambassadors, and mentors. On the online community, they serve as thought leaders, product experts, and moderators.
May 8, 2024

@Sadie Stokes I think you are going to need to work with your support team and see why it is not applying properly in your instance.  It could be a number of different items and having access to your instance should make it easy for them to identify what it is.

 

Suggest an answer

Log in or Sign up to answer
TAGS
AUG Leaders

Atlassian Community Events