Search...
FAQs Subscribe
Pie
FAQs
Recent topics Flagged topics Hot topics Best topics
Search...
Search within HTML Pages with CSS and JavaScript Search Coderanch
Advance search Google search
Register / Login
advertise on coderanch thread boost granny book review grid polymorphism
  • Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
advertise on coderanch thread boost building better world book book review grid meaningless drivel
this forum made possible by our volunteer staff, including ...
Marshals:
  • Tim Cooke
  • Campbell Ritchie
  • Ron McLeod
  • Liutauras Vilda
  • Jeanne Boyarsky
Sheriffs:
  • Junilu Lacar
  • Rob Spoor
  • Paul Clapham
Saloon Keepers:
  • Tim Holloway
  • Tim Moores
  • Jesse Silverman
  • Stephan van Hulst
  • Carey Brown
Bartenders:
  • Al Hobbs
  • Piet Souris
  • Frits Walraven

CSS Conditional

 
Jesse Torres
Ranch Hand
Posts: 985
posted 15 years ago
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
    Send
  • Quote
  • Report post to moderator
Is it possible to throw in an else statement in the below CSS conditional statement? If so how? I've tried everything to no avail.

<!--[if IE]>
<style>
div.logo {
margin-left: 10px;
}
</style>
<![endif]-->

Thanks,
 
Eric Pascarello
author
Posts: 15385
6
posted 15 years ago
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
    Send
  • Quote
  • Report post to moderator
You could do

div.logo {
_margin-left: 10px;
}

Better to make sure you specify a DOC-TYPE on the page to force IE to act in compliance mode. (that is if you have not done that already)

Eric
 
Bear Bibeault
Sheriff
Posts: 67619
173
I like...
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
posted 15 years ago
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
    Send
  • Quote
  • Report post to moderator
Eric, could you explain what that does?

[Asking smart questions] [About Bear] [Books by Bear]

 
Eric Pascarello
author
Posts: 15385
6
posted 15 years ago
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
    Send
  • Quote
  • Report post to moderator
It is an IE hack: you can read about how it works:

http://wellstyled.com/css-underscore-hack.html

Personally I would see if setting the doctype on the page to strict will fix the problem.

Eric
 
Roy Ivar Moe
Greenhorn
Posts: 21
posted 15 years ago
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
    Send
  • Quote
  • Report post to moderator
Hey,

I'm personally against css hacks.

First of all I agree with Eric on the doctype.

Then I would make sure that you have:



so you know you are working with "a clean slate".

If this doens't work, you can use JavaScript if this is supported by your clients. With JavaScript you can sniff the browser, then assign a class attribute to the body tag e.g. <body class="ie">

This way your css can look like this:



Now that's more readable than any hack...!

This also gives you a way to really fine-tune your css. Imagine hypothetical something like this:



you get the idea.

This method is promoted by Scott Isaac over at Microsoft Spaces, only they put the class attribute in the html tag, which doesn't validate.

Hope any of this helps...

Regards,
Roy
[ July 06, 2006: Message edited by: Roy Ivar Moe ]
 
Jesse Torres
Ranch Hand
Posts: 985
posted 15 years ago
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
    Send
  • Quote
  • Report post to moderator
Thanks a lot guys for all of your help. Nevertheless, why are some people against CSS hacks?

Thanks,
 
Roy Ivar Moe
Greenhorn
Posts: 21
posted 15 years ago
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
    Send
  • Quote
  • Report post to moderator
As new browsers are released, and new browser versions emerge, how do you know the parsing bug or feature you are relying on will not be removed or modified. How comfortable do you feel about your web page, application being future-proof when you are using a css hack?

I mean, you have lots of people who have based their hacks on features that IE doesn't support, and suddenly IE7.0/8.0/9.0 etc comes along and now IE supports these features (but the rendering bugs haven't been fixed) and will now be able to render the rules that weren't meant for IE.

There is also a readability issue. Did you notice how Eric came with a "piece of css", and then Bear Bibeault didn't understand it. Well, that kinda underlines the point.

These are just my thoughts, though,

Regards,
Roy
[ July 06, 2006: Message edited by: Roy Ivar Moe ]
 
Eric Pascarello
author
Posts: 15385
6
posted 15 years ago
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
    Send
  • Quote
  • Report post to moderator
Also another thing make sure if you see weird spacin that you do not have extra whitespace (including returns) around tags. IE is bad with this for some reason.

I would try to look at something like this



and do this



Eric
 
Yuriy Fuksenko
Ranch Hand
Posts: 413
posted 15 years ago
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
    Send
  • Quote
  • Report post to moderator
if you require JavaScript anyway, you can use something like the following


taken from
http://archives.hwg.org/hwg-techniques/001501bf9de8$6911a200$6c1dd0d1@jeff
[ July 06, 2006: Message edited by: Yuriy Fuksenko ]
 
WHAT is your favorite color? Blue, no yellow, ahhhhhhh! Tiny ad:
Building a Better World in your Backyard by Paul Wheaton and Shawn Klassen-Koop
https://coderanch.com/wiki/718759/books/Building-World-Backyard-Paul-Wheaton
reply
reply
    Bookmark Topic Watch Topic
  • New Topic
Boost this thread!
Similar Threads
More...