Docs

[cmeklir]

Rebuilding on staging site.
Made everything transparent and moved the content up.
I don’t understand why this jumps the footer to the top.
URL:http://0e8.7cd.myftpupload.com/
The gray line under the menu is the topborder of the footer.
Here is the CSS that I used:`

/*rework1*/
.x-navbar .desktop .x-nav > li > a {
        padding-top: 50px !important;
}
.x-logobar{border:none !important;}
.x-brand{padding-right:10%;}
.x-nav{float:left !important;}
.menu-primary-menu{position:relative;top:40px;}
.x-container{width:100% !important;max-width:4000px !important;}
.entry-wrap{padding:0px !important;}
header,.x-navbar,.x-nav-bar-fixed-top{background:transparent !important;}
.home .x-container{position:absolute;top:0;}
.home .entry-wrap{padding-top:0 !important;} 
.home div#top.site div.x-container.max.width.offset div.x-main.full{position:absolute !important;top:0 !important;margin-top:-110px;}
.home .x-container{margin-top:0 !important;}
.home .x-navbar{box-shadow:none !important;}

[Jade]

Hi there,

The footer area moves to the top of the page because of these codes in the customizer:

.home .x-container {
    position: absolute;
    top: 0;
}

.home div#top.site div.x-container.max.width.offset div.x-main.full {
    position: absolute !important;
    top: 0 !important;
    margin-top: -110px;
}

Since the main content got an absolute position assigned to it. Kindly remove those codes so that the footer area will get back to its normal position.

Thank you.

[cmeklir]

How else can I move the slider up underneath the navbar area so that its content extends right to the top of the page?

[Lely]

Hello There,

I can see that you have figure this out. The slider is now underneath the navbar.

Please note that the following CSS is not needed:

.home .x-container{margin-top:0 !important;}
.home .x-container{position:relative;top:0;}

I can see that you have use this custom CSS to move it up:

.home div#top.site div.x-container.max.width.offset div.x-main.full {
    position: relative; /*This is not needed*/
    top: 0 !important; /*This is not needed*/
    margin-top: -110px;
}

Although this custom CSS will do the job also instead of above:

.home .forcefullwidth_wrapper_tp_banner {
    margin-top: -110px !important;
}

Hope this helps.

[cmeklir]

Thanks, I’ll clean out the unnecessary junk as it can only hurt me when I start to correct the appearancefor mobile.

[Joao]

Hi There,

Let us know if you need further help.

Thanks,

Joao

[Author]

Posts