IE6 and second class in CSS

Discussion in 'HTML' started by pablopatito, Jul 26, 2007.

  1. pablopatito

    pablopatito Guest

    I have the following page which seems to work in all browsers except
    IE6. In IE6, the second class (myclass2) is ignored, but the first
    class works fine. Is there something wrong with my code, or is there a
    workaround. Any advise for a relative novice would be much
    appreciated.


    <style>
    #mainbody {background: red;width:600px}
    #mainbody.myclass1 {background: yellow;width:300px}
    #mainbody.myclass2 {background: green;width:300px}
    </style>

    <div id="mainBody">Hello</div>

    <div id="mainBody" class="myclass1">World</div>

    <div id="mainBody" class="myclass2">World</div>
    pablopatito, Jul 26, 2007
    #1
    1. Advertising

  2. pablopatito wrote:

    > I have the following page which seems to work in all browsers except
    > IE6. In IE6, the second class (myclass2) is ignored, but the first
    > class works fine. Is there something wrong with my code, or is there
    > a workaround. Any advise for a relative novice would be much
    > appreciated.


    Do you have this working on a web server? Provide a URL.

    > <style>
    > #mainbody {background: red;width:600px}
    > #mainbody.myclass1 {background: yellow;width:300px}
    > #mainbody.myclass2 {background: green;width:300px}
    > </style>
    >
    > <div id="mainBody">Hello</div>
    >
    > <div id="mainBody" class="myclass1">World</div>
    >
    > <div id="mainBody" class="myclass2">World</div>


    An id is only permitted once on a page. You would notice this at:
    http://validator.w3.org/

    Why don't you wrap all your content in one div which uses the
    id="mainBody" ?

    --
    -bts
    -Motorcycles defy gravity; cars just suck
    Beauregard T. Shagnasty, Jul 26, 2007
    #2
    1. Advertising

  3. pablopatito

    dorayme Guest

    In article
    <>,
    pablopatito <> wrote:

    > I have the following page which seems to work in all browsers except
    > IE6. In IE6, the second class (myclass2) is ignored, but the first
    > class works fine. Is there something wrong with my code, or is there a
    > workaround. Any advise for a relative novice would be much
    > appreciated.
    >
    >
    > <style>
    > #mainbody {background: red;width:600px}
    > #mainbody.myclass1 {background: yellow;width:300px}
    > #mainbody.myclass2 {background: green;width:300px}
    > </style>
    >
    > <div id="mainBody">Hello</div>
    >
    > <div id="mainBody" class="myclass1">World</div>
    >
    > <div id="mainBody" class="myclass2">World</div>


    Try lower case in the html to match the css.

    --
    dorayme
    dorayme, Jul 26, 2007
    #3
  4. pablopatito

    pablopatito Guest

    pablopatito, Jul 27, 2007
    #4
  5. pablopatito

    Neredbojias Guest

    Well bust mah britches and call me cheeky, on Fri, 27 Jul 2007 08:09:49 GMT
    pablopatito scribed:

    > On 26 Jul, 17:43, "Beauregard T. Shagnasty"
    > <> wrote:
    >> Do you have this working on a web server? Provide a URL.

    >
    > Here is an example:
    > http://jns.shared.hosting.zen.co.uk/tmp/page1.htm
    > http://jns.shared.hosting.zen.co.uk/tmp/page2.htm
    >
    > Page 1 works in IE6, but page 2 doesn't. This is because page 1 uses
    > the first class, and page 2 uses the second class. Both work fine in
    > other browsers. Thanks for your help.


    All the other browsers are wrong. IE6 is right.

    #myid .myclass { something } refers to:

    <div id="myid"><div class="myclass">Da content.</div></div>

    --
    Neredbojias
    Half lies are worth twice as much as whole lies.
    Neredbojias, Jul 27, 2007
    #5
  6. pablopatito

    John Hosking Guest

    pablopatito wrote:
    > On 26 Jul, 17:43, "Beauregard T. Shagnasty" wrote:
    >> Do you have this working on a web server? Provide a URL.

    >
    > Here is an example:
    > http://jns.shared.hosting.zen.co.uk/tmp/page1.htm
    > http://jns.shared.hosting.zen.co.uk/tmp/page2.htm
    >
    > Page 1 works in IE6, but page 2 doesn't. This is because page 1 uses
    > the first class, and page 2 uses the second class. Both work fine in
    > other browsers. Thanks for your help.


    See http://isaacschlueter.com/2006/03/ie-multi-selector-bug/
    and
    http://www.quirksmode.org/bugreport..._MSIE_6_Selector_with_an_ID_and_a_Class_.html
    (or for a non-wrapped version of second link above:
    http://preview.tinyurl.com/ywvqmm )

    Pablo, if you have more questions about CSS, subscribe to
    comp.infosystems.www.authoring.stylesheets

    --
    John
    John Hosking, Jul 27, 2007
    #6
  7. pablopatito wrote:

    > "Beauregard T. Shagnasty" wrote:
    >> Do you have this working on a web server? Provide a URL.

    >
    > Here is an example:
    > http://jns.shared.hosting.zen.co.uk/tmp/page1.htm
    > http://jns.shared.hosting.zen.co.uk/tmp/page2.htm
    >
    > Page 1 works in IE6, but page 2 doesn't. This is because page 1 uses
    > the first class, and page 2 uses the second class. Both work fine in
    > other browsers. Thanks for your help.


    I got your sample code to work as expected by correcting the CASE of
    your ID, as already mentioned by someone else,
    from
    <div id="mainBody"
    to
    <div id="mainbody"

    --
    -bts
    -Motorcycles defy gravity; cars just suck
    Beauregard T. Shagnasty, Jul 27, 2007
    #7
  8. pablopatito

    pablopatito Guest

    John,
    Thanks for those links. That seems to be the exact problem I'm having.

    Beauregard,
    I've fixed the case on my url's listed, but its still not working.

    I'm thinking I will have to use two classes instead, rather than one
    ID and one class, as in here:
    http://jns.shared.hosting.zen.co.uk/tmp/page3.htm
    This seems to get around my problem, but means editing about 50 pages.

    Many thanks.
    pablopatito, Jul 27, 2007
    #8
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Ivor O'Connor
    Replies:
    4
    Views:
    845
    Isofarro
    Nov 25, 2003
  2. Peter Mount
    Replies:
    4
    Views:
    946
    Peter Mount
    Jan 31, 2006
  3. yelipolok
    Replies:
    4
    Views:
    255
    John W. Krahn
    Jan 27, 2010
  4. Pugi!
    Replies:
    0
    Views:
    237
    Pugi!
    Feb 5, 2007
  5. timothytoe
    Replies:
    4
    Views:
    153
Loading...

Share This Page