CSS for removing space between branding and header

[gisow 0]

Hey! I have a quick question about my page, i can't seem to find the padding or the parameter to adjust for removing the white space underneath the header and over the branding section. Anyone that could tell me where and maybe how i can adjust it!

Here's the page: http://bailando.nu/

Many thanks in advance.

[catrina 103]

You might need to adjust the margin parameters for the header or branding section instead by using negative values: http://www.w3schools.com/css/css_margin.asp

[gisow 0]

Thanks for the reply, but this solution does not seem to work for us. There simply is no change when we add negative values to either header or branding through css. We have done this through the "Custom Code" section in the backend. Some assistances would be very appreciated.

[basmati 4]

my suggestion: put the top background image

url("http://bailando.nu/wp-content/plugins/pagelines-sections/page-border/images/deco_border_l_top_tall.png") no-repeat scroll center bottom transparent

in .page-canvas and delete #top_page_border and also #footer_page_border

url("http://bailando.nu/wp-content/plugins/pagelines-sections/page-border/images/deco_border_l_bot.png") no-repeat scroll center top transparent

[/code]

and put the background image from that div into the footer

than you can use padding and margin between the elements.

i think that would work more easy than your version.

[catrina 103]

@basmati Thanks for posting

@gisow Please let us know if basmati's suggestion works for you

[gisow 0]

Thanks for trying to help basmati its very appreciated, unfortunately my expertise in the area does not allow for me to follow your advise, since i don't know how. Pagelines should as i understand it does not require to much technical knowledge, and i must say I'm very disappointed in the "page borders" section which only seem to mess things up. On top of that it seems "page borders" is removed from the store so i can't contact the developer for help, is this a risk were taking purchasing section/themes & plugins?

Would greatly appreciate if someone could help with a solution since we really want to keep the style, perhaps you could tell me how i would go about applying the changes you suggest basmati and thanks for the suggestions so far.

Best regards

[catrina 103]

To apply basmati's changes, try adding this to Custom Code > Custom CSS:

.page_canvas {background-image: url("http://bailando.nu/wp-content/plugins/pagelines-sections/page-border/images/deco_border_l_top_tall.png") no-repeat scroll center bottom transparent;}

#footer_page_border, #top_page_border {display: none;}

If it's wrong, I think it's best if basmati advises!

[gisow 0]

Unfortunately that did not work Catrina, i then tried adding the following:

.content-pad {

    padding-bottom: 0px;

    padding-left: 0px;

    padding-right: 0px;

    padding-top: 100px;

}

#branding .content-pad {

    padding-bottom: 5px; 

    padding-top: 25px;

}

As you can see on the site that did not work out very well, but perhaps it helps you see the problem. I'm really stressed now and really need to get this to work, hope someone can assist me.

Best regards

[catrina 103]

http://bailando.nu/ <- Is a coming soon page currently activated here or is this the homepage?

[James B 436]

Hi there, i've read the above but I'm not really sure what effect you're looking for. I'm assuming you want to move the white space down so you can see the border at the top of page? Like this http://screencast.com/t/0Kpo9iWCE5

If so try this css

#header section:first-child .content-pad {

    margin-top: 46px;

    padding-top: 40px;

}

I think in order to get the border to extend behind the slider you'll need to add is as a background to the slider. Can guarantee that will work but seemed to do the job in firebug.

#features {background: url("http://bailando.nu/wp-content/plugins/pagelines-sections/page-border/images/deco_border_l_mid.png") repeat-y scroll center top transparent;}

[gisow 0]

Thanks James, that fixed the border behind the slider problem, but the css for the header didn't do anything oddly. Otherwise the thing you present in your screenshot is the only thing currently that needs to be solved, tried a few solutions now but there seems to be a conflict somewhere.

Anyone got any idea?

Best regards

[catrina 103]

What exactly are you trying to fix? And what conflict is being caused?

[gisow 0]

Hello Catrina, the only problem that remain is that currently the branding/header is making an appearance above the border as seen here http://postimage.org/image/uqncviy4n/, what i want is for it to be displayed as James B suggested http://screencast.com/t/0Kpo9iWCE5.

Hope there is a simple solution for this issue.

Best regards

[Rob 547]

The image making up the current header is what has the break in the border, built right into the graphic. It is not caused by code, but by graphics.

[gisow 0]

Okey thanks for clearing that up, but how would i go about solving the issue presented? It can't be the logo graphic since its does no overlap http://postimage.org/image/ddjlb6flh/. I can't believe something that looks this trivial is so hard to solve in pagelines.

Hope for a final solution,

Best regards

[Danny+ 1,327]

Hi,

Add this to your custom CSS and apologises it took so long to resolve the issue.

#site .section-branding .content {
background: transparent;
}

[jmoffett 0]

I am also having this problem.

I want to remove about a 2 line gap from between the banner and header.

I have been trying to find a solution for weeks but still no luck.

I have tried all of the above.

If the site was for myself I wouldn't be as concerned but it's for a client and me not appearing

like a twit would be desirable.

 

 Thanks in advance

 

Jenny

 

[Rob 547]

Jenny, this topic is marked resolved.  Please open a new one and we'll be happy to reply.  You may reference this topic.