Jetpack subscribe form CSS?Tweaks

Hi @djibux,

Thank you so much for sharing the solution here. ??

I was unable to replicate any trouble with Jetpack’s subscription form on a clean install of Singl. Would you be able to provide a link to your site and/or let me know the specific behind the display issues you mentioned?

In addition: You should not edit your theme’s style.css file directly. Any changes you make there will be lost when it comes time to update your theme. Instead, you can activate Jetpack’s custom CSS module and add CSS to override the parent theme’s there.

If you can provide a link to your site then I can help further with CSS, also.

Hello,

You are totally right, using custom CSS rules is better. Just changed that ??

The website (https://sto-live.com/) is not broken anymore. There were two issues:

• The green “subscribe” button was displayed on the bottom right of the screen (instead of next to the email field)
• The email field was almost 100% wide

You can view those issues by disabling the latest embedded CSS (#19), the one with the following:

.subscribe-form-wrapper .jetpack_subscription_widget {
	position: relative;
	padding: 0;
	margin: 0 auto;
	width: 720px;
}

/* 960px > x */
@media only screen and (max-width: 959px) {
	.subscribe-form-wrapper .jetpack_subscription_widget {
		width: 688px;
	}
}

/* 769px > x */
@media only screen and (max-width: 767px) {
	.subscribe-form-wrapper .jetpack_subscription_widget {
		width: 100%;
	}
}

Hi @djibux,

Thank you for sharing the link to your site! I was able to replicate the problem and have reported it back to the team. I’ll let you know when I hear back.

Have a great weekend in the meantime!

Great! Thanks a lot.