By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
429,116 Members | 1,319 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 429,116 IT Pros & Developers. It's quick & easy.

How to use script in <head> ?

P: n/a
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<title>Home Page</title>
<!--[if IE 6]>
<style#navlist a { height: 1em; } </style>
<![endif]-->
</head>

Is the [ if / else ] statement above JavaScript? If not, what kind of script is
it?

The problem this solves is border spacing - IE will render differently than FF -
when using a list like this:

<div id="navlist">
<ul>
<li><a href="index.html">Home Page</a>
<li><a href="index.html">Menu Item 01</a>
<li><a href="index.html">Menu Item 02</a>
<li><a href="index.html">Menu Item 03</a>
<li><a href="index.html">Contact Us</a>
</ul>
</div>
Here is the CSS for the navlist:

#navlist a {
background-color:none;
display:block;
padding:8px 2px 8px 10px;
border-style:none none solid;
border-width:medium medium 1px;
border-color:#333333;
}

#navlist {
width:120px;
margin-bottom:20px;
}

#navlist ul {
margin:0;
padding:0;
list-style-type:none;
}

#navlist li {
margin:0;
}

Where can I learn more about the type of script used in my example?

Oct 14 '06 #1
Share this Question
Share on Google+
8 Replies


P: n/a
"deko" <de**@nospam.comwrote:
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<title>Home Page</title>
<!--[if IE 6]>
<style#navlist a { height: 1em; } </style>
<![endif]-->
</head>

Is the [ if / else ] statement above JavaScript? If not, what kind of script is
it?
A proprietary MS construct called "conditional comment":
http://msdn.microsoft.com/workshop/a...omment_ovw.asp

There are various ways to feed different CSS to IE and to proper
browsers. Each method has it's own positives and negatives. Search an
appropriate group (not this one since it is about HTML, try
comp.infosystems.www.authoring.stylesheets) or the web for a rundown.
>The problem this solves is border spacing - IE will render differently than FF -
when using a list like this:
[code snipped]

Don't post code, post a url instead.

Another way to fix this IE bug is to add "zoom:1" to the "#navlist a"
rule.

--
Spartanicus
Oct 15 '06 #2

P: n/a
A proprietary MS construct called "conditional comment":
http://msdn.microsoft.com/workshop/a...omment_ovw.asp
Ah, I see. Conditional Comments sound like a good way to go - just use a
separate stylesheet for IE, like this:

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="iestyle.css" />
<![endif]-->

From what I've read, this is a reliable solution.

Still, dealing with IE is a chore. My guess is MS purposely left IE an ugly
mess so other browsers (FF, Opera) would gain market share and leave them less
vulnerable to lawsuits. They are certainly capable of making IE standards
compliant, but have chosen not to.

Whenever the question of "why didn't they ..." comes up, the answer is usually
money.

Oct 15 '06 #3

P: n/a
deko wrote:
Ah, I see. Conditional Comments sound like a good way to go - just use a
separate stylesheet for IE, like this:
I do this, but it only has one line in it - to approximately fix font
sizes for high-res screens with large font display. Even this much I
really dislike using.

What do people think belongs in an "IE only" stylesheet? What's
justifiable to put in there?

Oct 16 '06 #4

P: n/a
Andy,
What do people think belongs in an "IE only" stylesheet? What's
justifiable to put in there?
Im afraid we are going to needit, if IE7 comes along!
How to make something which uses the new opportunities of IE7, without
losing the IE6 users?

Johan
http://www.web.garden.be
Andy Dingley wrote:
deko wrote:
Ah, I see. Conditional Comments sound like a good way to go - just usea
separate stylesheet for IE, like this:

I do this, but it only has one line in it - to approximately fix font
sizes for high-res screens with large font display. Even this much I
really dislike using.

What do people think belongs in an "IE only" stylesheet? What's
justifiable to put in there?
Oct 16 '06 #5

P: n/a

Jobe wrote:
What do people think belongs in an "IE only" stylesheet? What's
justifiable to put in there?

Im afraid we are going to needit, if IE7 comes along!
Why?

It's the same web, so why should a new and hopefully better browser
need even more hacks? I think our difference here is that I see a
browser specific stylesheet as an abomination to be tolerated if
unavoidable, you're seeing it as a channel to go in even more weird
IE-only directions.
How to make something which uses the new opportunities of IE7, without
losing the IE6 users?
I don't want new "opportunities", I want the old bugs dead.

Oct 16 '06 #6

P: n/a
How to make something which uses the new opportunities of IE7, without
losing the IE6 users?
>I don't want new "opportunities", I want the old bugs dead.
Agreed. But until MS chooses to make IE standards compliant, web developers
have to deal with it.

What I like about Conditional Comments is that only IE reads them (a supposedly
reliable feature of IE, including IE7). So there is no additional overhead.
The size of a standards-compliant stylesheet is not bloated with IE hacks, and
visitors smart enough to use standards-compliant browsers are not penalized in
any way.

So, maintaining an IE-specific stylesheet like this:

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="iestyle.css" />
<![endif]-->

is, IMHO, the cleanest and most effective way to manage the display
peculiarities of IE. An iestyle.css can contain every hack and workaround to
accommodate each IE version (all the way back to IE 5), all cordoned off the
side, where they belong.

Oct 16 '06 #7

P: n/a
VK
deko wrote:
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="iestyle.css" />
<![endif]-->

is, IMHO, the cleanest and most effective way to manage the display
peculiarities of IE.
Full ACK.

Just to make the picture complete: IE's conditional comments have two
forms of syntax:
1) content revealing - which you used
2) content hiding

<!--[if IE]>
<p>This part will be parsed by IE</p>
<![endif]-->

<![if !IE]>
<p>This part will be skipped by IE parser</p>
<![endif]>

The content hiding syntax makes the validator all upset and grunchy :-)
so it never went into wide use. Yet a thing to mention.

Both forms (content revealing and content hiding) allows major.minor
version check as well:

<!--[if lt IE 6]>
<p>This Internet Explorer is older than v6 (so some 5.x)</p>
<![endif]-->

<!--[if gte IE 6]>
<p>This Internet Explorer is v6 or higher</p>
<![endif]-->

<!--[if IE 7.0]>
<p>This browser is Internet Explorer 7.0 (first official release).</p>
<![endif]-->

Oct 26 '06 #8

P: n/a
deko wrote:
><!--[if IE]>
<link rel="stylesheet" type="text/css" href="iestyle.css" />
<![endif]-->

is, IMHO, the cleanest and most effective way to manage the display
peculiarities of IE.

Full ACK.

Just to make the picture complete: IE's conditional comments have two
forms of syntax:
1) content revealing - which you used
2) content hiding

<!--[if IE]>
<p>This part will be parsed by IE</p>
<![endif]-->

<![if !IE]>
<p>This part will be skipped by IE parser</p>
<![endif]>

The content hiding syntax makes the validator all upset and grunchy :-)
so it never went into wide use. Yet a thing to mention.

Both forms (content revealing and content hiding) allows major.minor
version check as well:

<!--[if lt IE 6]>
<p>This Internet Explorer is older than v6 (so some 5.x)</p>
<![endif]-->

<!--[if gte IE 6]>
<p>This Internet Explorer is v6 or higher</p>
<![endif]-->

<!--[if IE 7.0]>
<p>This browser is Internet Explorer 7.0 (first official release).</p>
<![endif]-->
Thanks for the clarification.

Maintaining multiple stylesheets for different versions of IE (in addition to my
primary standards-compliant stylesheet) is pain, but still easier than any other
solution I've found.

I have not had to do anything IE 7 specific yet but, from I've read, I may need
to at some point. The stuff in my IE 6 stylesheets is mainly to deal with float
weirdness and adjustment of height, margins or padding.

Oct 27 '06 #9

This discussion thread is closed

Replies have been disabled for this discussion.