SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Addict
    Join Date
    Sep 2008
    Posts
    341
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    What is: *:first-child+html .widget h3.handle.icon{

    To remove an entire CSS file, I'm putting all the IE-specific styles into the main CSS file (there's not that many).

    So instead of:
    Code:
    <!--[if lt IE 9]> <link type="text/css" rel="stylesheet" href="http://static.domain.com/css/ie.css" /><![endif]-->
    ///I will use this:

    Code:
    <!--[if lt IE 9]>      <html class="ie"> <![endif]-->
    <!--[if IE 9]><!--> <html>         <!--<![endif]-->
    ... so obviously I then do this:

    Code:
    .ie width: 50px; // instead of just width:50px
    etc.

    The question is: what do I do with this?

    Code:
    *:first-child+html .widget h3.handle.icon

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,297
    Mentioned
    460 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by johnsmith153 View Post
    Code:
    *:first-child+html .widget h3.handle.icon
    Just put it in your regular style sheet. I can't quite tell what it does, though. Was that in your IE style sheet? Most versions of IE wouldn't understand that anyway.

  3. #3
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well the * selector selects all the elements present in the page & the + selector is a sibling.

    So the final code would be

    Code:
    *:first-child+html.ie .widget h3.handle.icon
    or

    Code:
    *:first-child+.ie .widget h3.handle.icon

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,475
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    "*:first-child+html" is a convoluted IE7 hack and works on the same basis as the * html ie6 where IE imagines that html has a parent but it doesn't.

    If you want styles to apply to IE7 only then you would just use the rule as it is.

    e.g.
    Code:
    *:first-child+html div{background:red}/* only ie7 is red */
    However there is a much simpler hack for IE7 only and that is as follows:

    Code:
    *+html div{background:red}/* only IE7 gets this */
    If you want to target IE6 only then use the old fashioned * html hack.

    Code:
    * html div{background:red}/* only IE6 gets this */
    Of course you could just as well add each one into your CC's classes on the html element and target whichever version of IE you need without using the hacks.

    It is unlikely that the same hacks yo give to IE8 will be the same ones you give to IE7 unless you aren't catering for ie7 and under of course.


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
  •