Topic on Project:Support desk

The following CSS has no effect:

.mw-headline{
    margin-top: 30px;
}

however, this does have effect:

.mw-headline{
    margin-left: 100px;
}

Same problem with padding.

How can i add margin or padding above headings?

Apparently, the ".mw-headline" .CSS rule gets overridden by the more defined ".mw-headline h2" rule for "margin-top", already present in the skin.

You will have to use something like:

.mw-headline h2, .mw-headline h3 {
    margin-top: 30px;
}

That seems to have no effect as well.

you mean ".mw-headline h2" in the skin, and ".mw-headline h3" , ".mw-headline h4" , etc?

I think so (I'm not exactly sure what you meant there).

In .CSS rules with higher specificity (i.e. ".mw-headline h2") overrides rules with lower specificity (i.e. just ".mw-headline"). As in this particular case higher specificity rules are already defined in the skin, you will need to add a rule with greater or equal specificity in your MediaWiki:Common.css.

So far only this works:

h2>span{
    padding-top: 30px;
}

But would be preferable if i could use the classname somewhere in that.

Apologies, hadn't actually tested the rule.

Another way to make this work, would be the following:

#mw-content-text > div > h2,
#mw-content-text > div > h3, 
#mw-content-text > div > h4 {
    margin-top: 30px;
}

so, going roundabout way through a different named element?

Should work, assuming the headings are the only element ever to fit that selector.