Big gap on top widget

Hi David – I’m not seeing a big gap. This is what it looks like for me in Firefox 41.0.1:

1) If you’re still seeing a big gap on your end, please let me know what browser and version you’re using, what type of device, and what operating system/version.

2) Please also upload a screenshot to help in troubleshooting.

Here’s a guide on how to make a screenshot:
https://en.support.wordpress.com/make-a-screenshot/

You can upload the screenshot – in a graphic format like JPG, PNG, or PDF – in your Media Library, and provide a link so I can see it, or upload it with a service like Imgur or Snaggy.

Hi Kathryn,

sorry, i should have specified the gap is on top widget area . See :
https://davidbernard.fr/support/Sans-titre-1.jpg

Hi there, the gap above the widgets is caused by a top margin of 110px set for h1 heading type. Add the following CSS and you can adjust the 110px value as desired.

.widget-title {
    margin-top: 110px;
}

If you have not yet done so, I would suggest creating a child theme so that any customizations you make will not be overwritten by a future theme update. Alternately you can use the Edit CSS function in the Jetpack plugin, or use one of the other Custom CSS plugins that will keep CSS changes from being overwritten.

Child Themes
Child Theme creation plugins
Jetpack plugin
Custom CSS plugins

Hi !

and thank you for your help. This is working but it creates another gap. See :

https://myleneandre.com/support/mylene.jpg

i’ve tried to add this on custom css plugin but nope…

.element.style {
padding-top: 17px;
}

Hi, I’m not seeing that gap at the top of the widget area. Which browser/version are you seeing this in? I’ve checked in Safari, Chrome and Firefox.

Oh, and on the element.style, that won’t work in CSS. What that means is that a style was declared in the element HTML tag (div, p, etc.). What you have to do is to find the actual CSS class or ID for that element in the HTML and then use that. Typically with a style that is declared in the HTML tag, you will need to add the !important keyword to the CSS value declaration to get it to override, like this:

.widget-title {
    margin-top: 110px !important;
}

Hi,

thank you very much for all details ??
sorry for inconvenience but the last gap i’ve talked has disappeared (sometimes i forget my browser cache ?? )
Regards,

David