Adjust page position below the header

Support
#1

I am testing a new layout for my site using the app demo provided with X Version: 5.2.0.

See test site https://thecloudseminar.com/confirm/

Problem area: Header: Note Almost done... above the logo.

How do I push the page content a bit downwards?

Please advise. Thanks.

#2

Hi @lvnilesh,

Thanks for writing in.

Add this in your custom CSS:

.page-id-295 .entry-title.h-landmark spa {
margin-top:30px
}

Let us know how it goes.

Thanks.

#3

added this custom css.

.page-id-295 .entry-title.h-landmark spa {
margin-top:30px
}

No change. Problem persists.

#4

Is adding this a recommended approach? What are the drawbacks?

.h-landmark > span {
  margin-top: 70px;
}

This still does not solve the similar problem noted in https://thecloudseminar.com/faqs/

#5

https://thecloudseminar.com/my-account/
and related woocommerce pages are also problematic.

#6

Hi There,

Please try to remove the CSS. Go to Theme Options > Header > NAVBAR TOP HEIGHT (PX). Adjust that value instead. Increase default 90px. See this: https://screencast-o-matic.com/watch/cb6e2lIaGI

Hope this helps.

#7

I removed all CSS and edited Customizer> Header> Navbar top height 130px.

Issues persist on these links:

https://thecloudseminar.com/my-account/
https://thecloudseminar.com/blog/
https://thecloudseminar.com/hello-world/
https://thecloudseminar.com/cart/
https://thecloudseminar.com/product/cloud-seminar/
https://thecloudseminar.com/shop/ 
https://thecloudseminar.com/sessions/session/
https://thecloudseminar.com/sessions/tag/seminar/
https://thecloudseminar.com/sessions/session/the-cloud-seminar/
https://thecloudseminar.com/sessions/session/live-conference/

Also, in mobile portrait view, the logo and the hamburger menu are not aligned properly.

What would be the solution?

#8

Hi,

Upon checking, I can see you are no longer using xtheme, kindly activate the theme again so we can help.

Thanks

#9

reactivated the x theme again

#10

Hi There,

Please add the following code to Theme Options CSS

If that does not help, please provide your lign credentials in a secure note

.x-main {
    
    margin-top: 170px;
}

.x-sidebar .widget {

    margin-top: 130px;
}

Thank you

#11

Thanks. I added this to customizer

.x-main {margin-top: 130px;}
.x-sidebar .widget {margin-top: 130px;}

I notice mobile layout showing unnecessary gaps below the header. What would be a fix for that?

#12

Hi again,

Please add the following code in your Customizer as well:

@media screen and (max-width: 767px) {
    .x-main {margin-top: 0px !important;}
    .x-sidebar .widget {margin-top:  0px !important;}
}

Hope this helps!

1 Like