How do I remove the big space between the header/menu and the image right below it?

[vcarden]

These is a large space and it is driving me nuts because I cannot get rid of it!

Thank you

[Adam7]

What is the address of the site you're having trouble with, @vcarden? I'll take a look.

[vcarden]

Hi,

http://www.cardensphotography.com

Thank you

[Adam7]

This won't get rid of all of it, but it'll reduce the space some:

1. Click on your Gallery in the editor

2. Choose the "Spacing" option

3. Change the top margin option to zero

[vcarden]

Thanks, but I already did that.

[Adam7]

To reduce the space more than that you'd need to customize the CSS of your theme.  Are you familiar with CSS? You can do this by going to the Theme tab and clicking on "Edit HTML / CSS".

[BRANDUR]

Hi Adam.

for Me i have a slideshow.  But also i BIg White space above and im trying to find css code that i can reduce the space.

but. i dont the answear.  pleasee help.

[Queso]

Hey there! What site are you seeing that on right now?

[BRANDUR]

its not published yet. but im seeing it on creationingenesis.org

[Queso]

It looks like that page is using a customized theme right now. Is that space you mentioned appearing in a standard theme as well?

[BRANDUR]

yes in standand theme as well there is a huge white space on top  like 200px

[Mark27]

Hi Adam,

here I have a similar question. I don't know if it is a question of the chosen theme?
But the space between my menu and the very top of the page is now 120px.
I tried to add maring:0; to menu ul but in vain...
THis is the webpage: http://www.berdimark.hu/
and the html now it looks like this:
menu {
font-size: 12px;
text-transform: uppercase;
font-weight: 700;
border-top: 1px solid rgba(116, 116, 116, 0.15);
}
.menu ul {
list-style: none;
}
.menu li {
display: inline-block;
padding: 7px 0;
margin-right: 30px;
}
.menu a {
color: #3b3b3b;
}

[leveltolevel]

Hi Adam,

I have this issue as well. I am familiar with HTML/CSS. I just don't know where in the code I can reduce the margin/padding between the texte-box and and the menu bar.

Thanks!

[Adam7]

It can help to use Chrome/Safari's Web Inspector to look at the code of your live site. You can usually find what class is controlling the styling for a given element that way.

[buzyreading]

Edit HTML/CSS: what code am I looking for to remove or minimize the space between the blog title and the text. What code am I looking for if I need to remove the blog title?

Thanks!

[njasper]

Hi - Did you ever find a solution for this? Thanks

[larsontw16]

Go to edit site. Click Themes, Edit HTML/CSS.

Click main.less under STYLES

Find your code that talks about padding. Since you are worried about the padding at the top, if you are merely trying to adjust a theme you've chosen, that code will likely be within the first 100 lines of code. My code snippet was as follows and the part  at the bottom, in red, is the part I am talking about.

--------------------------------------------------------------------------------
fieldset, input {
margin: 0;
padding: 0;

}

a img {
border: 0;
}

a {
text-decoration: none;
}

/* Fonts
--------------------------------------------------------------------------------*/

@import url('//fonts.googleapis.com/css?family=Playfair+Display:900,900italic');

@import url('//fonts.googleapis.com/css?family=Maven+Pro:900');

/* Icons */

@font-face {
font-family: 'icons';
src:url(images/icons.eot?-h6wei0);
src:url(images/icons.eot?#iefix-h6wei0) format('embedded-opentype'),
url(images/icons.woff?-h6wei0) format('woff'),
url(images/icons.ttf?-h6wei0) format('truetype'),
url(images/icons.svg?-h6wei0#icons) format('svg');
font-weight: normal;
font-style: normal;
}

/* General Styling and Structure
--------------------------------------------------------------------------------*/

.yelp-review {
max-width: 100% !important;
}

html {
height: 100%;
}

body {
width: 100%;
font-family: 'Maven Pro', sans-serif;
-webkit-font-smoothing: antialiased;
font-size: 16px;
color: #222222;
line-height: 2em;
-webkit-transition: padding 0.3s ease-in-out;
-moz-transition: padding 0.3s ease-in-out;
-o-transition: padding 0.3s ease-in-out;
transition: padding 0.3s ease-in-out;
}

     body.has-header {
     padding-top: 7.0em !important;
     }

------------------------------------------------

As you can see, there were other times the code mentioned "padding" but those were not the ones I am trying to adjust. If you look at my clients page on http://www.mywashingtondcdentist.com/contactus.html you can see there is a very, very small margin between the menu and body now.

Luckily with Weebly, when you change code, it auto refreshes to show you what you just changed. So find sections that mention "padding," change the size drastically, and see what padding it adjusts. If it's the wrong padding, no harm done, just put the original size back in. With the coding I mentioned, it was at 12.0em which had a huge space between the menu and body. Adjusting to 7.0em currently has my body right snug up underneath the menu.

Hopefully that helped, feel free to message me if I can help you anymore!

[Marjo1]

After many tries I removed the header and uploaded the elements in it again. That worked. For me a lot less effort than changing the HTML-code.

[Kay11]

I've read all the answers and tried everything and cannot get the huge white space above and below the blog title out of this page: http://nicelymorrise.weebly.com/blog -- Please give me a way out of this white space! 

[Adam7]

Can you check that page in the editor again, @Kay1? I reduced the padding on the image itself, and also made the section it was in smaller. For reference you can do that by clicking in the background of a section, then clicking and dragging the small blue circle you see at the bottom of the section.

[Kay11]

Thanks, Adam -- that is much better!! I just wish I could figure out how to do it myself! Looks much better-- I see about reducing the section/box the blog title is in, but I sure wish I could figure out how to reduce the padding. I looked at the code, but could not figure out where that particular padding is. But fixed for now, and thanks!