Archived

This topic is now archived and is closed to further replies.

  • 0

CSS for removing space between branding and header


Question

Posted · Report post

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.

Share this post


Link to post
Share on other sites

17 answers to this question

Posted · Report post

Hi,

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



#site .section-branding .content {
background: transparent;
}
1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

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;}

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

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.

Share this post


Link to post
Share on other sites

Posted · Report post

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.

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

@basmati Thanks for posting

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

Share this post


Link to post
Share on other sites

Posted · Report post

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

 

post-47388-0-42841000-1361234419_thumb.p

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

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!

Share this post


Link to post
Share on other sites

Posted · Report post

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.

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites
This topic is now closed to further replies.