Top Space Distance Not the Same in Mobile Mode

yogeshj25

Hello, I noticed that the custom Top Space Value I entered for my pages is not the same when it goes into mobile mode. It seems like the spacing goes back to default in mobile. Here is an example page: http://www.yogjoshi.com/about/
I would like the mobile top space value to be the same.
Thank you!
Yog

Air

Hello :-)

There is strong style that overwrites this and it looks like this:

@media only screen and (max-width: 768px) {
	#mid::before {
		height: 48px !important;
	}
}

You can try to copy exactly same style to your custom CSS with changed value.

It should work.

With kind regards.

yogeshj25

Hello. So the custom top space of this page, http://www.yogjoshi.com/about/ , is 15px when in desktop mode. I went into custom css and pasted the code and it is still not working. This is what I put:

@media only screen and (max-width: 768px) {
	#mid::before {
		height: 15px !important;
	}
}

Thanks!

Air

Please fix your custom CSS, you have there HTML tags <style> and </style>.

With kind regards.

yogeshj25

That did the trick! The spacing is only working for a display screen the size of a phone. I would also like the spacing to work for the maximum width in mobile mode. So when I use a tablet, like an ipad, it will have the same spacing. Or when I shrink my desktop web browser, it will have same spacing.

Air

Then instead of above code use this

@media only screen and (max-width: 1024px) {
	#mid::before {
		height: 15px !important;
	}
}

With kind regards.