-
Posts
-
http://novelist.maximfactory.com/?p=63
When the sign up button in the sidebar is hovered over it is not highlighting properly. I have adjusted the hover link color on enfold to #666666 and it works on the links fine. Not sure what I have done wrong here?
Any idea?
Thanks.
This is what is used for the button in the sidebar:
<div id=”head-mail”>
<H2>Join myCurves List </H2></p>
<p><font face=”Verdana”><font color=”#E76B5C”>Get Inner Secrets Audio Book for </font><span><font color=”#E76B5C”>FREE</font></span></p>As well as free chapters and updates on blogs, book releases and community news!
</div>
<!– Begin MailChimp Signup Form –>
<link href=”http://cdn-images.mailchimp.com/embedcode/classic-081711.css” rel=”stylesheet” type=”text/css”>
<style type=”text/css”>
#mc_embed_signup{background:#; clear:left; font:14px Helvetica,Arial,sans-serif; }
/* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
<div id=”mc_embed_signup”>
<form action=”http://curveswelcome.us6.list-manage.com/subscribe/post?u=1351b59809d434925e639e9f8&id=27d652a652″ method=”post” id=”mc-embedded-subscribe-form” name=”mc-embedded-subscribe-form” class=”validate” target=”_blank” novalidate><div class=”mc-field-group”>
<label for=”mce-FNAME”>Name: </label>
<input type=”text” value=”” name=”FNAME” class=”” id=”mce-FNAME”>
</div>
<div class=”mc-field-group”>
<label for=”mce-EMAIL”>Email:* </label>
<input type=”email” value=”” name=”EMAIL” class=”required email” id=”mce-EMAIL”>
</div>
<div id=”mce-responses” class=”clear”>
<div class=”response” id=”mce-error-response” style=”display:none”></div>
<div class=”response” id=”mce-success-response” style=”display:none”></div>
</div> <div id=”side-submit”><p class=”Book-title-foot”><input class=”wpcf7-form-control wpcf7-submit” type=”submit” value=”Join Today!” name=”subscribe”></p></div>
</form>
</div><!–End mc_embed_signup–>
Hi Michael, it looks like you’ve made a change in your child.css that’s making your text transparent. It’s actually affecting all of your buttons (search button, submit button, etc):
The offending code is:
.header_color .button:hover, .header_color .ajax_controlls a:hover, .header_color #submit:hover, .header_color .big_button:hover, .header_color .contentSlideControlls a:hover, .header_color #submit:hover, .header_color input[type=”submit”]:hover {
background-color: #E76A5C;
color: transparent;
border-color: #C5483A;
}When you see commas in css, it indicates a bunch of styles being targeted all at once. The rule you are applying affects all of the following styles:
.header_color .button:hover,
.header_color .ajax_controlls a:hover,
.header_color #submit:hover,
.header_color .big_button:hover,
.header_color .contentSlideControlls a:hover,
.header_color #submit:hover,
.header_color input[type=”submit”]:hover {
color:transparent;
}————————————————
color: (is always font color). In this case you made your font transparent which may not have been your intent.If there’s ever a style you’re not sure what it does, you might find W3S to be a really helpful reference:
http://www.w3schools.com/css/.image-overlay { display: none !important; }
That was the only thing I had in Quick CSS, I removed it and I am still having the issue.
I still can’t figure out why the font is transparent.
This was done to make it possible to use the editor in posts:
This was added to Enfold Child: Theme Functions (functions.php)
add_filter(‘avf_builder_boxes’,’enable_boxes_on_posts’);
function enable_boxes_on_posts($boxes) {
$boxes[] = array( ‘title’ =>__(‘Avia Layout Builder’,’avia_framework’ ), ‘id’=>’avia_builder’, ‘page’=>array(‘portfolio’, ‘page’, ‘post’), ‘context’=>’normal’, ‘expandable’=>true );
$boxes[] = array( ‘title’ =>__(‘Layout’,’avia_framework’ ), ‘id’=>’layout’, ‘page’=>array(‘portfolio’, ‘page’, ‘post’), ‘context’=>’side’, ‘priority’=>’low’);
$boxes[] = array( ‘title’ =>__(‘Additional Portfolio Settings’,’avia_framework’ ), ‘id’=>’preview’, ‘page’=>array(‘portfolio’, ‘page’, ‘post’), ‘context’=>’normal’, ‘priority’=>’high’ );return $boxes;
}We just need to look at the CSS for visual/styling issues. Taking a second look, you don’t see a hover background colour change because you have set this colour as the same for both background and highlight colour:
.main_color input[type=”submit”] {
background-color: #E76A5C;
color: #FFF;
border-color: #C5483A;
}.main_color input[type=”submit”]:hover {
background-color: #E76A5C;
color: transparent;
border-color: #C5483A;
}Go to Enfold > General Styling > Look at the “main content” and “alternate content” tabs
Do you have the same colour set for “Primary Colour” and “Highlight Color” in either one of these tabs? If so you’re effectively making the background and hover colour the same, so that you can’t see any visible hover change. Play with these colours to see which one you’re doubling up on.Second, try adding the following to your quick.css:
.main_color input[type=”submit”]:hover {
color: #FFF;
}Whatever colour you put there should override the transparent text. Just make sure it doesn’t have an unintended result somewhere else. Aside from that you may need someone from the Kriesi to help you out as they know the theme and what might be causing it.
That quick css code addition worked perfectly.
Thank you for taking the time on this one, greatly appreciated!!
- You must be logged in to reply to this topic.