SitePoint Sponsor

User Tag List

Page 1 of 2 12 LastLast
Results 1 to 25 of 30
  1. #1
    SitePoint Member
    Join Date
    Jan 2005
    Location
    Queensland Australia
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Cool CSS But works only in Firefox?

    Came across this the other day, is a simple and cool feature:

    a [href $='.pdf'] {
    padding-left: 23px;
    background-image: url(images/pdf-small.gif);
    background-repeat: no-repeat;
    }

    <a href="a-nice-speech.pdf">Link to PDF</a>

    What it does is looks at 'href' code inside the 'a' tag, if the file name has '.pdf' at the end of the file name, it will apply the rest of the CSS code.

    Only problem is, it works great in Firefox 2, but Not IE 7.

    Any ideas why?
    Thanks in advance.
    .TM
    "Pork is not a verb" - Bart Simpson
    "I would like to thank..."
    Help us help you, Help us help the community too!
    http://www.cvsystems.com.au

  2. #2
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    IE doesn't understand it. Opera and Safari do, IIRC as does Firefox (obviously). Until IE can support it, you're best off just using a class on the selector and then style it that way.

  3. #3
    SitePoint Member
    Join Date
    Jan 2005
    Location
    Queensland Australia
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Can you give me an example please?
    "Pork is not a verb" - Bart Simpson
    "I would like to thank..."
    Help us help you, Help us help the community too!
    http://www.cvsystems.com.au

  4. #4
    SitePoint Addict CaryD's Avatar
    Join Date
    Nov 2006
    Location
    San Diego, CA
    Posts
    389
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by MarsdeNation View Post
    Can you give me an example please?
    Code CSS:
    a.pdf {
    padding-left: 23px;
    background-image: url(images/pdf-small.gif);
    background-repeat: no-repeat;
    }

    HTML Code:
    <a href="a-nice-speech.pdf" class="pdf">Link to PDF</a>

  5. #5
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I like to put the class before the href attribute, but that's just me.

  6. #6
    SitePoint Addict CaryD's Avatar
    Join Date
    Nov 2006
    Location
    San Diego, CA
    Posts
    389
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, I was momentarily torn and hesitant in that decision.

  7. #7
    SitePoint Member
    Join Date
    Jan 2005
    Location
    Queensland Australia
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Damn IE, When are they going to catch up?

    the 'href' code is dynamically generated by a PHP application and thus I do not have access to the code to add a class like that. I can only change the style sheet.

    It was a good idea while it lasted.

    Thanks all.
    "Pork is not a verb" - Bart Simpson
    "I would like to thank..."
    Help us help you, Help us help the community too!
    http://www.cvsystems.com.au

  8. #8
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,095
    Mentioned
    28 Post(s)
    Tagged
    1 Thread(s)
    Off Topic:

    Well, I was momentarily torn and hesitant in that decision.

  9. #9
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,095
    Mentioned
    28 Post(s)
    Tagged
    1 Thread(s)
    You would be able to script it,
    get list of anchors in page,
    get href attribute,
    use string functions to see if ends in .pdf
    add class

  10. #10
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ask the person responsible for the app to modify it so you can insert the class then.

  11. #11
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,603
    Mentioned
    24 Post(s)
    Tagged
    1 Thread(s)
    The other alternative is to add the effect for those using modern web browsers and those using IE will not know what they are missing.
    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="^$">

  12. #12
    SitePoint Member
    Join Date
    Jan 2005
    Location
    Queensland Australia
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Not Good enough I am afraid **I wish
    I might just write a letter to Microsoft:


    Dear Microsoft,

    Hurry up and Get with the program.

    Many Thanks
    .TM
    "Pork is not a verb" - Bart Simpson
    "I would like to thank..."
    Help us help you, Help us help the community too!
    http://www.cvsystems.com.au

  13. #13
    bronze trophy
    Join Date
    Dec 2004
    Location
    Sweden
    Posts
    2,670
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    IE7 does support [foo$=bar], but only in standards mode.
    Simon Pieters

  14. #14
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    But don't forget about the insanely huge user base for IE 6 though - until it reaches IE5 or NN4 levels, using it is not something I would advise people to do.

  15. #15
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,603
    Mentioned
    24 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by Dan Schulz View Post
    But don't forget about the insanely huge user base for IE 6 though - until it reaches IE5 or NN4 levels, using it is not something I would advise people to do.
    People with JavaScript disabled should get pages that still work even though it may require a round trip to the server to perform validation etc.

    People with Stylesheets disabled should still be able to read the page content even though the formatting isn't as fancy as with it enabled.

    People with antiquated browsers such as IE6 should still be able to use the web page even though some of the page appearance controlled by stylesheet commands that it doesn't understand are missing.

    As long as the web page degrades gracefully when your visitor has JavaScript or stylesheets disabled or uses an antique browser such as IE6 what difference does it really make if the page isn't quitre the same for them as it is for people using a modern browser with CSS and avaScript enabled?

    If it isn't critical to the page then by all means use stylesheet commands that IE6 doesn't understand but which modern browsers do. If it is critical to the page then it shouldn't be done via stylesheets in the first place - it should be in the HTML with the rest of the content.
    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="^$">

  16. #16
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,095
    Mentioned
    28 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by felgall View Post
    If it isn't critical to the page then by all means use stylesheet commands that IE6 doesn't understand but which modern browsers do. If it is critical to the page then it shouldn't be done via stylesheets in the first place - it should be in the HTML with the rest of the content.
    Your right, and progressive enhancement is a great model to keep in mind. BUT..

    IE6 is the most popular browser on the planet!

    Another method that doesn't use advanced CSS works in this crucial browser so Dan's suggestion to use a simple class name is good advice.

  17. #17
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,603
    Mentioned
    24 Post(s)
    Tagged
    1 Thread(s)
    IE6 is only the third most popular browser amongst visitors to my site behind Firefox 2 and IE7. While I may get more Firefox users than a typical site I would expect the near equal split between IE6 and IE7 with IE6 slightly behind and falling would be fairly typical of most sites.

    How can IE6 be the most popular browser on the planet when more people now use IE7? (and if that isn't completely true now, it will be soon)
    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="^$">

  18. #18
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,095
    Mentioned
    28 Post(s)
    Tagged
    1 Thread(s)
    I'll stick with Dan's response then - there's a large enough userbase to warrant your support.

  19. #19
    SitePoint Wizard drhowarddrfine's Avatar
    Join Date
    Aug 2005
    Posts
    3,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I wouldn't call it the most 'popular'. I'd call it the most 'used'.
    progressive enhancement is a great model to keep in mind.
    In the book "Transcending CSS", top web designers are doing the opposite, progessive 'degradation'. They are using all the tools available on the web and those browsers that can't use them, typically IE, are just fed the same information with less features, eg, features it can't handle.

  20. #20
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,095
    Mentioned
    28 Post(s)
    Tagged
    1 Thread(s)
    I'll deliver the same style to IE6 as it's simple using another method, for something that IE6 simply can't do I would add features that only other browsers can use.
    Firefox handles multi-columns perfectly - too bad for other browsers that are behind the times? No, I'll use floats that all browsers can understand.

  21. #21
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    And just because they're the top designers doesn't mean they're doing the right thing. All it means is that they've been recognized for their previous achievements, which says a lot of good things about them.

  22. #22
    SitePoint Wizard drhowarddrfine's Avatar
    Join Date
    Aug 2005
    Posts
    3,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Andy Clarke (Author), Molly E. Holzschlag (Author), Aaron Gustafson (Technical Editor), Mark Boulton (Technical Editor), Joe Clark (contributor), Eric Meyer (contributor) and a bunch of other know nothings.

  23. #23
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Whoa, what happened here? What gives with the foul balls to left field Doc? Steve Bartman show up at another Cubs game?

    I didn't say that they're know nothings just because they're considered by many to be the top Web designers in the world. I'm just saying that because they've been recognized for their achievements doens't mean they're always right 100&#37; of the time. Sorry Doc but I just don't give people free passes. Especially in an industry that moves and evolves as quickly as this one.

    Yes, I respect them for their achievements, yes, I respect them for what they're doing now, but at the end of the day they're all human just like you and I are and the're bound to make mistakes once in a great while. Just like the rest of us.

    Off Topic:

    By the way, has anybody seen or heard from Molly in the past month or so? Her blog's been awfully silent as of late...

  24. #24
    SitePoint Wizard drhowarddrfine's Avatar
    Join Date
    Aug 2005
    Posts
    3,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If it was only one guy, I'd agree, but this is a flock of 'em saying the same thing.

    Molly is now a paid shill for Microsoft now so I'm sure they pay for her silence, too.

    Off Topic:

    I'll be in Chicago on Friday where you can buy me dinner. Has to be Friday cause I'm meeting my son for lunch on Saturday.

  25. #25
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Off Topic:

    Come to Aurora, not Chicago - I can't make it out to Chi-town right now.


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
  •