Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • October 3, 2018 at 2:21 pm #1017533
    timchurchman

    Hi,

    Wander if you can help… again.

    I am needing the button “SEND MESSAGE” below my form at the bottom of the page http://huntpr.co.za/#contact to change to a different color other than current light blue on rollover?

    Is there CSS for this?

    I tried:

    .page-id-734 input[type=’SEND MESSAGE’]:hover {
    background-color: #e3b38b;
    color: white;
    border-color: #e3b38b;
    }

    October 4, 2018 at 6:56 am #1017715
    Rikard

    Hey timchurchman,

    Please try the following in Quick CSS under Enfold->General Styling:

    .page-id-734 #contact input[type='submit']:hover {
  background-color: green !important;
}

    Best regards,
    Rikard

    October 4, 2018 at 9:54 am #1017788
    timchurchman

    Hi, doesn’t work unfortunately.

    Used this code:
    .page-id-734 #contact input[type=’SEND MESSAGE’]:hover {
    background-color: #ddae87 !important;
    }

    Color i needed it to change to is #ddae87 so changed your code to that.
    Also button needed it to say: “SEND MESSAGE” not ‘submit’ so amended code you gave to that.

    Added logins if need to take a look

    October 4, 2018 at 11:34 am #1017837
    Rikard

    Hi,

    This won’t work since type is not a reference to what text value the button has, but its functionality. It’s a submit form button.

    .page-id-734 #contact input[type=’SEND MESSAGE’]:hover {
background-color: #ddae87 !important;
}

    Please try the code I sent again without altering it.

    Best regards,
    Rikard

    October 4, 2018 at 11:58 am #1017851
    timchurchman

    Unfortunately still not working,

    Previously used this code and its still in quick CSS

    .page-id-734 input[type=’SEND MESSAGE’]:hover {
    background-color: #ddae87;
    color: white;
    border-color: #ddae87;
    }

    However even removing this doesn’t work

    October 5, 2018 at 5:32 am #1018123
    Rikard

    Hi,

    I removed your non-working CSS and added the one I posted on the very top of the Quick CSS box and it’s working, please review your site.

    Best regards,
    Rikard

    October 5, 2018 at 8:57 am #1018179
    timchurchman

    Thanks so much, really appreciate your help, there is unfortunately now a thin green line underneath?

    October 5, 2018 at 10:35 am #1018219
    Rikard

    Hi,

    I can’t see that on my end, but my screen is not the greatest though. You can add a border argument to the CSS in question as well though, or remove it using this:

    border:none !important;

    Best regards,
    Rikard

    October 5, 2018 at 2:16 pm #1018282
    timchurchman

    Hi thanks,

    I haven’t touched a thing but now the whole button rollover as green??

    October 6, 2018 at 6:29 am #1018414
    Rikard

    Hi,

    Yes, that is the colour I added with the CSS, please change it to the colour of your liking.

    Best regards,
    Rikard

    October 8, 2018 at 9:05 am #1018861
    timchurchman

    Sorry should have been more clear, i have adjust code to my color but doesn’t change:

    .page-id-734 #contact input[type=’SEND MESSAGE’]:hover {
    background-color: #ddae87 !important;
    }

    October 8, 2018 at 11:51 am #1018946
    Rikard

    Hi,

    Ok, but I’ve already told you that the CSS you are using will not work. Please use this instead:

    .page-id-734 #contact input[type='submit']:hover {
  background-color: green !important;
  border-color: red !important;
  color: pink !important;
}

    Replacing submit with your own text will not work.

    Just replace the colour with your own, regenerate files under Enfold->Performance, clear your local browser cache and reload the page.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.