www.webdeveloper.com
Results 1 to 4 of 4

Thread: [RESOLVED] Trouble with css first-child

  1. #1
    Join Date
    Aug 2007
    Location
    New Jersey, US
    Posts
    1,779

    resolved [RESOLVED] Trouble with css first-child

    Hi,

    I have table formatted like so:

    HTML Code:
    <table id="challengeDates">
    	<tbody>
    		<tr>
    			<td class="past">whatever</td>
    			<td class="upcoming">stuff</td>
    			<td class="upcoming">goes</td>
    			<td class="upcoming">here</td>
    		</tr>
    	</tbody>
    </table>
    And I want to style the first ".upcoming", so my CSS looks like:

    Code:
    #challengeDates .upcoming:first-child {
    	font-weight: bold;
    }
    But this isn't working but I'm not sure why. I guess that I'm not targeting the element correctly, but I'm not sure what I'm doing wrong. Any thoughts?

  2. #2
    Join Date
    Sep 2008
    Location
    Akron, OH
    Posts
    1,111
    It's not working because .upcoming doesn't have any children. I think what you're wanting is "first-of-type." I've never used this before and couldn't seem to get it to work in your example though
    I'm always up for networking with fellow web professionals. Connect with me on LinkedIn if you like!

  3. #3
    Join Date
    Aug 2007
    Location
    New Jersey, US
    Posts
    1,779
    Yeah, that makes sense.
    Unfortunately I need IE7 support. I think that I may use jQuery after page load to add a "next" class to the first instance of "upcoming". That may be best.

    Thanks for taking a look!

  4. #4
    Join Date
    Sep 2008
    Location
    Akron, OH
    Posts
    1,111
    That's exactly how I would do it too ... just a line of jQuery!
    I'm always up for networking with fellow web professionals. Connect with me on LinkedIn if you like!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles