michaelb428ping

Oops, I left out the “logo position fix” css for desktop width. Here it is again:

.site-logo {
	display: inline-block !important;
}

.home .entry-header {
	/* hide H1 on home */
	display: none;
}

/* for myStickymenu plugin */
.home #mysticky-nav .site-header {
	z-index: 10;
}

@media screen and (min-width: 801px) {
/* desktop width */

	/* logo position fix */
		.site-header .inside-header {
			flex-direction: row;
		}

	.socialLinks {
		width: 100%;
		display: flex !important;
		flex-direction: column;
		flex-wrap: wrap;
		float: right !important;
		text-align: right !important;
	}

}

@media screen and (min-width: 768px) and (max-width: 800px)  {
/* tablet width */
	
	/* logo position fix */
		.site-header .inside-header {
			flex-direction: row;
		}
	
	.socialLinks {
		width: 100%;
		display: flex !important;
		flex-direction: column;
		flex-wrap: wrap;
		float: right !important;
		text-align: right !important;
	}
	
}

Thank you.

Yes, that worked — thank you so much! 🙂

For those reading this, I restored the three footer columns in side-by-side arrangement for tablet width with this custom CSS:

@media screen and (min-width: 768px) and (max-width: 800px)  {
/* tablet width */

	/* restyle footer columns */
	.inside-footer-widgets {
		display: block !important;
		flex-wrap: wrap;
	}
	
	.inside-footer-widgets .footer-widget-1, .inside-footer-widgets .footer-widget-2, .inside-footer-widgets .footer-widget-3 {
		width: 30%;
		clear: none;
	}

	.inside-footer-widgets .footer-widget-1 {
		margin-bottom: 0 !important;
	}
	
	.inside-footer-widgets .footer-widget-2 {
		text-align: center !important;
		margin-top: -26px;
		margin-left: 30%;
		margin-right: 30%;
		margin-bottom: 0 !important;
	}
	
	.inside-footer-widgets .footer-widget-3 {
		margin-top: -25px;
		float: right !important;
	}
		
}

I was testing GeneratePress in MAMP — which sets up a local server environment — so that’s not reachable from the outside.

I will see if I can set something up on a more public server in the next few days.

If you need to log in, please let me know how I can send you a private message with the login information — there doesn’t seem to be a way to do that here on wordpress.org.

Thank you.

Oh, that’s one I haven’t tried yet. Thank you!

That works… sort of. For “generate_not_mobile_menu_media_query” I had to add this in after the min-width value assignment line in order to have a tablet width range (instead of the wanted appearance at a single tablet width value):
return ‘(max-width: 800px)’;

The menu now shows in tablet width, thank you! I usually have my tablet width separate so I can make CSS adjustments for that width only. I also have different CSS adjustments for desktop width, which are separate from tablet width.

But there are two odd things now — basically, I’m trying to make the tablet width responsive behavior act and appear like it does in desktop width.

1) Strangely, the logo is now centered (and centered only at 768px window width) instead of aligned left like it appears in desktop width. Is there a filter I can add to make the logo appear aligned left in my tablet width range (768px to 800px)?

2) Also, I have three columns in the footer, which now wrap (stack one atop each other) like in mobile width instead of appear side-by-side like they do in desktop width. Is there a filter I can add to make the footer columns appear side-by-side like they do in desktop width?

For the record, I now have this in my child theme’s functions.php file:

add_filter( 'generate_mobile_menu_media_query', function() {
	return '(max-width: 766px)';
} );

add_filter( 'generate_not_mobile_menu_media_query', function() {
	return '(min-width: 768px)';
	return '(max-width: 800px)';
} );

We’re almost there…

Thank you for your help!

Hello Nikita,

Yes, that fixed the distortion issue!

It seems that CSS was in there to compensate for the client wanting to have a large caption (226 characters) which made the image smaller to accomodate that.

It’s strange that Safari didn’t scale the image proportionally when that bottom padding was added (while Chrome and Firefox did scale the image proportionally.)

Thank you for your help!

I can now confirm the newly released Master Slider free 3.7.10 and Master Slider Pro 3.5.9 have now fixed this problem.

Does weMail send e-mail notifications to a list of subscribers when new content is posted in WordPress? Thank you.

The only way I “resolved” the missing fields issue was to type the fields back in again.

I’m sorry to say there wasn’t a way to restore the missing fields.