SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Guru
    Join Date
    Jan 2010
    Posts
    635
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Size But Not Color Of H2 Picked Up In Link

    Sitepoint Members,

    Why won't the color of my H2 get picked up?

    CSS
    h1,h2,h3{color:#9F9FFF;line-height:1.2}
    h2{font-size:130%;margin:3% 0 2%}


    HTML

    <table><tr><th><h2><a href="/abc.html">Example A</a></h2></th>
    <th>&nbsp;&nbsp;&nbsp;&nbsp;</th>
    <th><a href="/xyz-test.html"><h2>Example B</h2></a></th></tr></table><br /><br /><br />

    This code creates a white "Example A" of h2 size heading and a white "Example B" h2 size heading.
    The code also causes errors in the code for Example B:
    line 99 column 5 - Warning: missing </a> before <h2>
    line 99 column 60 - Warning: inserting implicit <a>
    line 99 column 113 - Warning: discarding unexpected </a>

    Why isn't the purple color of the H2 for Example A being picked up?
    When I fx the warning errors I get a white h2 font.

    Thanks,

    Chris

  2. #2
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,817
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    An <a> tag is an inline tag while a <h2> is a block tag. You must close any inline tags before you start a block. Try moving the <a> inside the Mh2>

    Note that it is proposed to change <a> so it can work as a block tag in HTML 5 but browsers are unlikely to have fully implemented that yet - particularly with regard to the application of CSS.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  3. #3
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,199
    Mentioned
    456 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by Chris77 View Post
    Why isn't the purple color of the H2 for Example A being picked up?
    Because you have an <a> inside it, so the text will be the color that the <a> is set to.

  4. #4
    SitePoint Guru
    Join Date
    Jan 2010
    Posts
    635
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Felgall - I have that in the first line.
    Ralp - Ok. So If I have links as one color and H2 another color, how can I make an H2 a link yet keep its color?

    Thanks

  5. #5
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,199
    Mentioned
    456 Post(s)
    Tagged
    8 Thread(s)
    If I have links as one color and H2 another color, how can I make an H2 a link yet keep its color?
    You will just have to style the link differently. E.g. style any link inside an h2 to have the color that you want for h2s:

    Code:
    h2 a {color:#9F9FFF;}

  6. #6
    SitePoint Guru
    Join Date
    Jan 2010
    Posts
    635
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Works great !

    Thanks Ralph !


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •