CSS for headings

LO,

I want to customise the headings in my space but can't find the CSS for it. How can I get hold of this?

Cheers.

3 answers

1 accepted

This widget could not be displayed.
OK, I've resolved the problem. I re-read the info that Abdoulae mentioned and noticed the bit about the CSS code review in Firefox.

I opened our wiki in FF and then went to Web Developer/Style Editor.

This opened a window that lists all the CSS a page has, seperated into different blocks/types of code. There's one called (this is only the end of the name) .doctheme.documentation/splitter.css which has all the headings info. This looked nothing like the CSS I found elsewhere on the internet (see above).

I coped this into the template, adjusted the margins and hey presto, I now have what I want. :)

For anyone else who might need to do this, this is what you are looking for:

.wiki-content h1 { margin-top: 2em; margin-bottom: .5em; font-size: 1.8em; }
.wiki-content h2 { margin-top: 2em; margin-bottom: .5em; font-size: 1.6em; }
.wiki-content h3 { margin-top: 1.5em; margin-bottom: .5em; font-size: 1.4em; }
.wiki-content h4 { margin-top: 1.2em; margin-bottom: .3em; font-size: 1.2em;}
.wiki-content h5 { margin-top: 1em; margin-bottom: .1em; font-size: 1.1em;}
.wiki-content h6 { margin-top: 1em; margin-bottom: .1em; font-size: 1.0em;}

Cheers.

This widget could not be displayed.

OK, I've been playing with the following. But all this does is change the padding for the page title, not the h1. It also doesn't change the font colour.

h1 {

font-color: red;
padding-top: 10px;
padding-bottom: 3px;
}

I've also tried:

h1.heading {

font-color: red;
padding-top: 10px;
padding-bottom: 3px;
}

and:

h1 {

color: red;
padding-top: 10px;
padding-bottom: 3px;
}

So, can anyone see what I'm doing wrong here?

Cheers.

It can be due to your CSS is getting overwritten by another. Try inspecting the H1 tag with your crome developer tools and you will find what is causing this overwritting thing. Thank You !!

Abdoulaye,

Thanks for th info. I've looked at these and the aren't detailed enough for what I want. I know nothing about CSS really, so need much more detail. Cheers.

Suggest an answer

Log in or Sign up to answer
Community showcase
Posted Thursday in United States

Local Atlassian Research Workshop opportunity on Sep. 28th

We're looking for participants for another workshop at Atlassian! We need Jira admins who have interesting custom workflows, issue views, or boards. Think you have a story to sh...

73 views 0 0
View post

Atlassian User Groups

Connect with like-minded Atlassian users at free events near you!

Find a group

Connect with like-minded Atlassian users at free events near you!

Find my local user group

Unfortunately there are no AUG chapters near you at the moment.

Start an AUG

You're one step closer to meeting fellow Atlassian users at your local meet up. Learn more about AUGs

Groups near you