SitePoint Sponsor

User Tag List

Results 1 to 9 of 9

Hybrid View

  1. #1
    Visit docquesting.com docquesting's Avatar
    Join Date
    May 2005
    Location
    Georgia USA
    Posts
    1,264
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE Hacks Please Explain in detail

    This has me upset that I should be required to code a seperate css page just for IE if I understand these hacks correctly. Here is what I understand so far with example code and please correct me if I am going the wrong way in my thinking.

    First I will post the xhtml insert to import css into that page.

    HTML Code:
    <style type="text/css">
    <!--
    @import url(http://www.url.com/test/css/styles.css);
    -->
    </style>
    Then the IE hack code that I located.
    PHP Code:
    <!--[if IE]>
      <
    style type="text/css">
        @
    import url(ie-styles.css);
      </
    style>
    <![endif]--> 
    Now I would use the following way of inserting this into my current code om home page.
    HTML Code:
    <style type="text/css">
    <!--
    @import url(www.url/test/css/styles.css);
    -->
    
    <!--[if IE]>
      <style type="text/css">
        @import url(ie-styles.css);
      </style>
    <![endif]-->
    
    </style>
    Now if this is not the proper way please tell me by example so that I can understand what is going on and how and why. Perhaps I can insert some sort of code within my currently validated css like this.

    <\......if ie......\>

    Thanks.

  2. #2
    SitePoint Enthusiast mkeefe's Avatar
    Join Date
    Sep 2004
    Location
    Boston
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Almost correct, accept the "if IE" would be outside the style tags.

    HTML Code:
    <style type="text/css"> 
    <!-- 
    @import url([url]www.url/test/css/styles.css[/url]); 
    --> 
    </style>
    
    <!--[if IE]>  
    <style type="text/css">  @import url(ie-styles.css); </style> 
    <![endif]-->
    mkeefeDESIGN - Scriptplayground

    Adobe Certified Expert | Actionscript Developer | PHP Developer

  3. #3
    Caveat surfer Buddy Bradley's Avatar
    Join Date
    May 2003
    Location
    Cambridge, UK
    Posts
    2,366
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by docquesting
    Now if this is not the proper way please tell me by example so that I can understand what is going on and how and why. Perhaps I can insert some sort of code within my currently validated css like this.

    <\......if ie......\>
    The way you have described is the current 'best practice' method of delivering an additional stylesheet to IE browsers. If you wanted to include IE-only styles within your valid stylesheet, you could use the Tan Hack:
    Code:
    * html #mydiv {
      ...
    }
    Putting star-html before a rule will mean only IE can see it, but it remains valid (AFAIK). However, keeping everything in a separate file makes maintenance easier.

  4. #4
    Pedantic Semantic blain's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    528
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    and the tan hack doesn't work in IE7
    Technology is dominated by two types of people:
    those who understand what they do not manage,
    and those who manage what they do not understand.

  5. #5
    SitePoint Enthusiast mkeefe's Avatar
    Join Date
    Sep 2004
    Location
    Boston
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    True about IE7, that is why you should use the preferred MS way "if IE"
    mkeefeDESIGN - Scriptplayground

    Adobe Certified Expert | Actionscript Developer | PHP Developer

  6. #6
    Visit docquesting.com docquesting's Avatar
    Join Date
    May 2005
    Location
    Georgia USA
    Posts
    1,264
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This helps quite a bit. Can you guys be so kind as to point me in the right direction re links and such that are a good read for ie css coding?

    I suppose that I should be coding for all versions above 5.0. How and where should I start to have the page look like it is supposed to?

  7. #7
    Caveat surfer Buddy Bradley's Avatar
    Join Date
    May 2003
    Location
    Cambridge, UK
    Posts
    2,366
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by docquesting
    Can you guys be so kind as to point me in the right direction re links and such that are a good read for ie css coding?
    In theory, you shouldn't really need to specifically code for IE if you write very clean, sensible CSS. It doesn't quite work out like that in practice, but I wouldn't recommend approaching it from the point-of-view you seem to be coming from, of "I must treat IE differently from the start".

    The best resource for learning about IE's peculiarities is PiE's page Explorer Exposed! That page lists all the major (and minor) things you should be aware of when debugging a page in IE.

  8. #8
    SitePoint Enthusiast mkeefe's Avatar
    Join Date
    Sep 2004
    Location
    Boston
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I tend to hit IE 5.5 and higher, but in rare cases the client requires 5.0 access.

    IE's blog has a great section on CSS in IE7 and older, but I have lost the link. I am sure someone else will be able to dig it up.
    mkeefeDESIGN - Scriptplayground

    Adobe Certified Expert | Actionscript Developer | PHP Developer

  9. #9
    Visit docquesting.com docquesting's Avatar
    Join Date
    May 2005
    Location
    Georgia USA
    Posts
    1,264
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Would this be it? From a quick glance over it seems only to talk about basic updates and not auctul coding methods.

    http://blogs.msdn.com/ie/archive/2005/07/29/445242.aspx

    Edit noticed a few links will need more time too browse.


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
  •