WordPress.org

Ready to get started?Download WordPress

Forums

Is my HTML for my splash page overriding my CSS code?!? (9 posts)

  1. WaniOlatunde
    Member
    Posted 1 year ago #

    Hi

    I'm hoping someone can help me - I am a complete code newbie but managed to put together a splash page to showcase my different sites. I have a number of links of the page and I want the text to change colour when I hover over the links...I looked it up and I understand that the following code should do so:

    a:hover {
    color:#E16F1D
    text-decoration:underline;
    }

    But then nothing happens on the page. I think that there is something in my html code that may be overwriting the CSS but I don't know what or where to look for it. Tried a quick search for "hover" but that didn't bring anything up.

    Or if there is a way to get CSS to override the HTML, that would be cool too.

    Please help.

    Thanks in advance.
    Wani

    The blog I need help with is http://www.waniolatunde.com.

  2. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    your links seem to 'formatted' by a span with inline styles;

    example:
    <td align="center"><span style="color: #ffffff;"><a href="http://www.weddings.waniolatunde.com/"><span style="color: #ffffff;"><img style="border: 2px solid #BCBCBC;" title="Nigeria Wedding Photographer Website" src="http://wop.smugmug.com/WOP/Admin/WOP/i-KzMfPNR/0/X3/wedding-image-for-splash-page-X3.jpg" alt="wedding image for splash page X3 Home "></span></a>  <a href="http://www.weddings.waniolatunde.com/"><span style="color: #ffffff;"><br>

    remove all inline styles from the templates and contents, and move all the styling into style.css...

    you will need to switch to the html mode of the post or page editor to find and remove the inline styles.

  3. WaniOlatunde
    Member
    Posted 1 year ago #

    aah great thanks. just to be clear, where does the inline style end? would it be?

    <span style="color: #ffffff;">

    thanks

  4. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    yes, this part <span style="color: #ffffff;"> and the corresponding </span>

    http://www.w3schools.com/tags/tag_span.asp

  5. WaniOlatunde
    Member
    Posted 1 year ago #

    great thanks - this is super helpful. will try it now...

  6. WaniOlatunde
    Member
    Posted 1 year ago #

    Hi Alchymyth

    I removed on the inline styles and now the page changed all the text to black with only the links remaining white and I still can't get the links to change colour when I hover.

    Any advice would be greatly appreciated.

    Thanks
    Wani

  7. WaniOlatunde
    Member
    Posted 1 year ago #

    Ok - got my text back by changing the colour in this code:

    #outer {
    font-family:Arial, Helvetica, sans-serif;
    color:#fff;
    font-size:12px;
    width:1400px;
    margin:0px 5px;
    }

    but still can't get the hover to work :-/

  8. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    there is a semicolon missing after color:#000

    a:hover {
          	color:#000
    	text-decoration:underline;
    }

    has to be:

    a:hover {
          	color:#000;
    	text-decoration:underline;
    }

    nothing to do with WordPress ...

  9. WaniOlatunde
    Member
    Posted 1 year ago #

    Perfect - works now. Thanks for all your help!

Topic Closed

This topic has been closed to new replies.

About this Topic