Title: Changing custom header CSS
Last modified: August 20, 2016

---

# Changing custom header CSS

 *  Resolved [dkchi2010](https://wordpress.org/support/users/dkchi2010/)
 * (@dkchi2010)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/changing-custom-header-css/)
 * Site and CSS coding was previously created and now needs changingon [http://www.snowcityarts.org](http://www.snowcityarts.org).
   One change is the newsletter signup form. We want it to be only a link on the
   text “newsletter signup” and to go to the follow page: [http://www.snowcityarts.org/contact.newsletter-sign-up](http://www.snowcityarts.org/contact.newsletter-sign-up).
 * Normally,I would input `<a>Newsletter Signup</a>`
 * However, when I do that the entire field disappears & even the new text doesn’t
   show up.
 * This is the current code:
 *     ```
       '<form name="ccoptin" id="CC" action="http://visitor.constantcontact.com/d.jsp" target="_blank" method="post" >
                       <input id="ccinput" type="text" name="ea" value="">
                       <!--<input  class="submitLink cufon" type="submit" value="SIGNUP" />-->
       				<input type="hidden" name="m" value="1102918733794">
       				<input type="hidden" name="p" value="oi">
                       <button type="submit" class="submitLink cufon">SIGNUP</button>
   
       </form>'
       ```
   
 * And this is the CSS code for that piece:
 *     ```
       '#header form#CC {
       	position:absolute;
       	width:210px;
       	top: 16px;
       	left: 486px;
   
       }'
       ```
   
 * _[Please use the code buttons or backticks (not quotes) when posting code]_
 * Any help would be GREATLY appreciated, please.
    dk

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

 *  [Odai Athamneh](https://wordpress.org/support/users/heyodai/)
 * (@heyodai)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/changing-custom-header-css/#post-3490096)
 * Where is the signup form on the page? All I could find was a link.
 *  Thread Starter [dkchi2010](https://wordpress.org/support/users/dkchi2010/)
 * (@dkchi2010)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/changing-custom-header-css/#post-3490131)
 * The form is at the top of the page in the header where it sayd “email” and “signup.”
   The form leads to Constant Contact. We want to change it to a link to an internal
   page with a form that stays on our site.
    dk
 *  [Odai Athamneh](https://wordpress.org/support/users/heyodai/)
 * (@heyodai)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/changing-custom-header-css/#post-3490155)
 * Thanks, it seems obvious now but I couldn’t see it before.
 * This code controls where the form directs to:
 * `action="http://visitor.constantcontact.com/d.jsp"`
 * So you could change that to keep the form working internally. However, if I’m
   understanding, you want to remove the form and replace it with a link?
 *  Thread Starter [dkchi2010](https://wordpress.org/support/users/dkchi2010/)
 * (@dkchi2010)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/changing-custom-header-css/#post-3490157)
 * I do want to remove the form, however in frustration I had replaced that code
   to the page and for whatever reason, it gave me a 404 error, even though the 
   page is there as input.
 * [http://www.snowcityarts.org/contact/newsletter-sign-up](http://www.snowcityarts.org/contact/newsletter-sign-up)
 * I’m not sure if it has something to do with the ‘action’ or the .jsp
 * Would much rather just replace it all with a text link.
 * Thanks for your time.
    dk
 *  [Odai Athamneh](https://wordpress.org/support/users/heyodai/)
 * (@heyodai)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/changing-custom-header-css/#post-3490204)
 * I played around with things using Google Chrome’s “Inspect Element” tool, which
   lets you edit a website’s code on-the-fly. Here are some thoughts.
 * I can see you already have part of the form commented out. Try going ahead and
   commenting the whole thing out, starting with
 * `<form name="ccoptin" id="CC" action="http://visitor.constantcontact.com/d.jsp"
   target="_blank" method="post">`
 * and ending at
 *     ```
       <button type="submit" class="submitLink cufon"><cufon class="cufon cufon-canvas" alt="SIGNUP" style="width: 52px; height: 13px;"><canvas width="61" height="18" style="width: 61px; height: 18px; top: -4px; left: -1px;"></canvas><cufontext>SIGNUP</cufontext></cufon></button>
       </form>
       ```
   
 * After that, I inserted a manual link like so:
 * `<a href="http://www.snowcityarts.org/contact.newsletter-sign-up" id="newsletterSignupLink"
   >Newsletter Signup</a>`
 * (As an aside, is there supposed to be a period after “contact” in that URL, as
   opposed to a dash?)
 * But the link is floating over the logo, and not easily visible. The form has 
   this CSS code attached to it:
 *     ```
       @media screen
       #header form#CC {
       position: absolute;
       width: 210px;
       top: 16px;
       left: 486px;
       ```
   
 * We already added an ID to the new link (`id="newsletterSignupLink"`), so you 
   just need to modify the CSS like so:
 *     ```
       @media screen
       #header, form#CC, #newsletterSignupLink {
       position: absolute;
       width: 210px;
       top: 16px;
       left: 486px;
       ```
   
 * And that worked when I did it in Chrome. Does it work for you?
 *  Thread Starter [dkchi2010](https://wordpress.org/support/users/dkchi2010/)
 * (@dkchi2010)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/changing-custom-header-css/#post-3490209)
 * Thank you Odai for your time and effort in this. I will work on it tonight and
   let you know.
    dk
 *  Thread Starter [dkchi2010](https://wordpress.org/support/users/dkchi2010/)
 * (@dkchi2010)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/changing-custom-header-css/#post-3490251)
 * YAY! Perfect!
 * Thank you so very, very much!
    dk

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

The topic ‘Changing custom header CSS’ is closed to new replies.

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [form](https://wordpress.org/support/topic-tag/form/)
 * [links](https://wordpress.org/support/topic-tag/links/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 7 replies
 * 2 participants
 * Last reply from: [dkchi2010](https://wordpress.org/support/users/dkchi2010/)
 * Last activity: [13 years, 3 months ago](https://wordpress.org/support/topic/changing-custom-header-css/#post-3490251)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics