Parallax Pro – White Space Under Menu

[Kim]

I'm using Parrallax Pro & the LayerSlider WP plugin for my site in development. For whatever reason, there is white space below the menu that I can't figure how to get rid of. Thanks for any help!

http://dev.connectiveinsights.com/~treedbooks/

[Christoph]

Hi Kim,

around line 549 of the style.css you have margin-top: 70px;

.parallax-home .site-inner {
    margin-top: 70px;
    max-width: 100%;
}

If you set that to 50px the white space is not showing.

But on mobile you can see the title Layer Slider and more white space. So you probably have to adjust the media queries.

---

https://www.christophherr.com | Genesis Customizations | Buy me a coffee

[Kim]

Awesome!!!! Thank you so much, Christoph!

Hummmm, I've never had to do anything w/ the media queries and wouldn't know where to start. Any chance you can point me in the right direction? Thanks!

[Christoph]

Hi Kim,

the white space on mobile is caused by the widget title.
You might want to remove the widget title from the slider widget or add this to the style.css:

#layerslider_widget-2 .widget-title {
	display: none;
}

The header/navigation looks nicer on mobile if you change (around line 1874)

.site-header .widget-area {
	width: 560px;
}

to

.site-header .widget-area {
	width: 570px;
}

---

https://www.christophherr.com | Genesis Customizations | Buy me a coffee

[Kim]

Oh gotcha. I didn't even realize the widget had a title for that item. I removed it. Thank you again!

[gcampton]

Media queries are towards the bottom of the CSS file, they deal with screen sizes. For instance I use a mobile first approach so all my css is geared towards mobile and then towards the bottom of the css some inclusions for web are given.

@media only screen and (min-width: 800px)

So everything 800px and above uses the css code below that line.

Typically you will see the opposite though, and media queries will be for mobile as 99.99% of theme design is for desktops.
@media only screen and (max-width: 960px)

@media only screen and (max-width: 600px)

[Author]

Posts