How to centre ‘submit’ button and email address field on mobile

  • Resolved Style_Chic

    (@style_chic)


    4 years, 11 months ago

    Hi there,

    Is there some CSS I can use to center the email address field and submit button on mobile?

    On desktop they are all on the one line but on mobile, the button falls below and both are aligned left.

    Also, is there a way to increase the width of the button? I’ve updated the button text to say ‘subscribe’ and now some of the text is cut off.

    I’m using the countdown theme.

    Thanks for such a great plugin. I’ve tried a bunch of these coming soon plugins and yours is by far the best.

    Have given you 5 stars ??

    Tegan

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)

  • Hello, thanks for your support!

    you can use this custom CSS:

    
@media only screen and (max-width : 520px) {
.cmp-subscribe input[type="email"] {
 width: 65%;
 border-top-right-radius: 0;
 border-bottom-right-radius: 0;
 display: inline-block;
margin-bottom: 0;
}

.cmp-subscribe input[type="submit"] {
 width: 35%;
 display: inline-block;
 margin-left: -7px;
 border-top-left-radius: 0;
 border-bottom-left-radius: 0;
}
}

    Ales

    Thread Starter Style_Chic

    (@style_chic)

    Perfect, thanks!

    Thread Starter Style_Chic

    (@style_chic)

    One last thing, how do I change the colour of the input text to black? It must be white at the moment and it doesnt show what you’re typing when your enter an email address in the field as the background is white too.

    Thread Starter Style_Chic

    (@style_chic)

    Actually scrap that. Just fixed it ??

    Plugin Author Ales

    (@alesmal)

    Alrighty ??

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘How to centre ‘submit’ button and email address field on mobile’ is closed to new replies.