Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Different Versions Of Ie6? Calling Rob

Featured Replies

Hello

 

Rob and Elan Man very kindly helped me to feed a different stylesheet to IE 6 yesterday, point of which was to set min-height in all other browsers and set just height in ie6.

 

Tested thoroughly yesteday and it did the job on IE6 on the laptop and worked in Ffox.

 

Just looked in IE6 here at work and when I increase text size the wrapper doesn't expand down as it did in other version of IE6.

 

Anyone know if the implementation of height changed at a ceratin point during IE6???Or any other ideas?

 

cheers

 

:flm7:

Just a thought but my standalone version of IE6 doesn't read conditional comments.

When I'm testing for IE6, I have to put the code in the main style sheet and use hacks to see if it works.

Is it a stand alone version at work?

  • Author
Just a thought but my standalone version of IE6 doesn't read conditional comments.

When I'm testing for IE6, I have to put the code in the main style sheet and use hacks to see if it works.

Is it a stand alone version at work?

 

Ah sounds plausible, what is a standalone version?

 

It says 6.0.2900.2180 xpsp_sp2_qfe if that helps.

 

cheers

:flm7:

A standalone browser, generally used for testing, is installed into its own directory on your pc and doesn't affect your registry. Basically it lets you run multiple versions of IE on the same computer. But it has its limitations.

If you have IE6 on your computer because it hasn't been upgraded, that is not a standalone browser.

Hope that makes sense! :)

Nothing changed in any versions of IE6 as far as I know. Is IE6 the only IE on that machine at work? Is it a standalone version basically, as sometimes they exhibit some strange behaviour that isn't true of a properly installed IE6.

  • Author
Nothing changed in any versions of IE6 as far as I know. Is IE6 the only IE on that machine at work? Is it a standalone version basically, as sometimes they exhibit some strange behaviour that isn't true of a properly installed IE6.

 

It's the only IE on the machine yes, but likely to run off the network.

 

It would seem that it's not being directed to the other stylesheet by the conditional comment. I can test this by changing a font colour in the styling somewhere on the stylesheet it ought to use.

 

Did notice another blip elsewhere on the site that wasn't the same at home.

 

thanks again

 

:flm7:

  • Author
Just a thought but my standalone version of IE6 doesn't read conditional comments.

When I'm testing for IE6, I have to put the code in the main style sheet and use hacks to see if it works.

Is it a stand alone version at work?

 

Hi Elan Man - any advice on how to add the code into the main stylesheet and then hack would be appreciated.

 

It's simply a swap of

 

all but lte ie6

 

min-height : 550px;

overflow : hidden

 

 

for

 

lte ie6

 

height : 550px;

 

 

(note lost the overflow : hidden;)

 

 

cheers

 

:flm7:

IE hack:

 

put *html in the stylesheet before the bit you're defining for IE6. eg:

*html img {
padding-bottom: 10px;
}

 

::edit::

If that's not what you wanted to do, apologies. I've been hitting the ginger wine and suspect I may have misread what you were after :)

  • Author
IE hack:

 

put *html in the stylesheet before the bit you're defining for IE6. eg:

*html img {
padding-bottom: 10px;
}

 

somewhat there so if i change -

 

/*all browser version follows*/

#wrapper {

margin : 10px auto 0 auto;

padding : 0 0 0 4px;

width : 954px;

min-height : 550px;

overflow: hidden;

background-color : #cccccc;

text-align : left;

}

/* ie 6 and below version follows*/

#wrapper {

margin : 10px auto 0 auto;

padding : 0 0 0 4px;

width : 955px;

height : 550px;

background-color : #cccccc;

text-align : left;

}

 

for

 

#wrapper {

margin : 10px auto 0 auto;

padding : 0 0 0 4px;

width : 954px;

min-height : 550px;

overflow: hidden;

background-color : #cccccc;

text-align : left;

}

 

*html #wrapper {

margin : 10px auto 0 auto;

padding : 0 0 0 4px;

width : 955px;

height : 550px;

background-color : #cccccc;

text-align : left;

}

 

and drop the conditional comment..

 

:flm7:

  • Author
looks about right :)

 

Nope not working.

 

Anyone...

 

Here's the deal I need the wrapper to expand down the page if text size is increased (want to avoid overflows).

 

Currently I have this code for all except IE in my stylesheet

 

/*wrapper centres page*/

#wrapper {

margin : 10px auto 0 auto;

padding : 0 0 0 4px;

width : 954px;

min-height : 550px;

overflow: hidden;

background-color : #cccccc;

text-align : left;

}

 

Then used a conditional comment to point IE users to aanother stylesheet with this code in it

 

#wrapper {

margin : 10px auto 0 auto;

padding : 0 0 0 4px;

width : 954px;

height : 550px;

background-color : #cccccc;

text-align : left;

}

 

This worked by using min-height and overflow hidden for all but <IE6. Then IE6 was fed the height of 550px and wrongly interpreted this and expanded the bg colour / wrapper suitably.

 

However in a stand alone version of IE6 which is used by a large target demographic for the site, the conditional comment pointing to the second stylesheet wasn't read and the first stylesheet applied.

 

I have tried taking the conditional out of the XHTML and adding this to the one stylsheet;

 

/*wrapper centres page*/

#wrapper {

margin : 10px auto 0 auto;

padding : 0 0 0 4px;

width : 954px;

min-height : 550px;

overflow: hidden;

background-color : #cccccc;

text-align : left;

}

 

*html #wrapper {

margin : 10px auto 0 auto;

padding : 0 0 0 4px;

width : 954px;

height : 550px;

background-color : #cccccc;

text-align : left;

}

 

But it makes no difference.

 

Stumped....

 

Any help gratly appreciated.

 

 

:flm7:

 

Edit: link if required

 

www.studio9films.co.uk/test/pages/about.html

 

www.studio9films.co.uk/test/css/stylea.css

www.studio9films.co.uk/test/css/styleb.css

 

note: the conditional comment has been removed for now from the xhtml file but read

 

<!--[if lte IE 6]><link rel="stylesheet" type="text/css" media="screen" href="../css/styleb.css" />

<![endif]-->

You'll need a space between the * and the html, afaik! * is a universal selector, and thus should be treated as a normal selector — not tagged onto the end of another one (you wouldn't see divp {}, for example)

 

* html #wrapper { … }

  • Author
You'll need a space between the * and the html, afaik! * is a universal selector, and thus should be treated as a normal selector — not tagged onto the end of another one (you wouldn't see divp {}, for example)

 

* html #wrapper { … }

 

Thanks but no luck.

 

Could me specifying a default stylesheet have anything to do with it i.e.

 

<meta http-equiv="Default-Style" content="default" />

<!--meta data ends-->

 

 

<!--stylesheets-->

<link rel="stylesheet" type="text/css" href="../css/stylea.css" media="screen" title="default" />

<!--stylesheets end-->

 

Might the stand alone IE6 then ignore the added

 

 

<!--[if lte IE 6]><link rel="stylesheet" type="text/css" media="screen" href="../css/styleb.css" />

<![endif]-->

 

 

:flm7:

Haven't come across this issue personally, but try removing the default stuff — it can't hurt to try and diagnose the problem.

  • Author

cracked it with...

 

 

/*wrapper centres page*/

#wrapper {

margin : 10px auto 0 auto;

padding : 0 0 0 4px;

width : 954px;

min-height : 550px;

#height : 550px;

overflow: hidden;

#overflow: none;

background-color : #cccccc;

text-align : left;

}

 

 

cheers folks.

 

:flm7:

Nice one, glad to hear you got it cleared up in the end!

  • Author
Nice one, glad to hear you got it cleared up in the end!

 

Cheers and I learnt a bit about conditional comments and stylsheet hacks in the process.

 

But, my CSS invalidates due to the # hack...not the end of the world and I feel the end justifies the means on this one. but first time I've let an invalidation pass..

 

Any thoughts on how to validate this hack or is it just is...?

 

:flm7:

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.