MSIE6/Netscape7/Firefox1 CSS problem

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • spamfilter@tannerritchie.com

    MSIE6/Netscape7/Firefox1 CSS problem

    Hi,

    Although I appreciate that Netscape/Firefox implement CSS more
    according to the rules than MSIE does, I am having a problem getting
    Netscape etc to display a page as I would like.

    Have a look at http://www.tannerritchie.com/test2/ in different
    browsers.

    I have set up a simple browser sniffing script which directs the user
    to a different style sheet in the root directory according to their
    browser (sitestyle.css for MSIE, mozillastyle.cs s for others), however
    the Netscape version still does not look how I would like it.

    The problem area is the left hand vertical navigation bar, where I am
    using links which change when the mouse pointer is placed over them. In
    MSIE it looks how I want it. In Netscape I have tweaked it to look
    adequate, but still not good. The code used in the right hand
    navigation bar (catalogue) is the same as I use in the MSIE stylesheet,
    and you can see it creates a real mess.

    Can anybody suggest a way to make the left hand navbar look the same in
    Netscape/Mozilla, etc., as it does in IE?

    Many thanks

    Fred Smith

  • David Dorward

    #2
    Re: MSIE6/Netscape7/Firefox1 CSS problem

    spamfilter@tann erritchie.com wrote:
    [color=blue]
    > Have a look at http://www.tannerritchie.com/test2/ in different
    > browsers.
    >
    > I have set up a simple browser sniffing script which directs the user
    > to a different style sheet in the root directory according to their
    > browser (sitestyle.css for MSIE, mozillastyle.cs s for others)[/color]

    .... and nothing for Opera, Konqueror, Safari, or any browser which doesn't
    claim to be IE or Netscape. You would be better of writing one sensible
    style sheet and then applying hacks as needed to work around browser bugs.
    (I find that very few such hacks are needed).

    I note that your choice of Doctype triggers Quirks Mode in browsers. Among
    other things, this causes MSIE to get padding and border wrong (putting
    them inside the width) and to apply the width property to inline elements
    (like <a>). It is this last bit that I suspect is causing your problems (I
    can't be bothered to get my Windows PC working to test in IE).

    See http://css.maxdesign.com.au/listamatic/ for a bunch of prewritten and
    tested style sheets that I believe get the effect you want on your list of
    links.

    I also urge you to pick a unit more apropriate for use on the screen for
    your font sizes then "pt". http://css-discuss.incutio.com/?page=UsingPoints


    --
    David Dorward <http://blog.dorward.me .uk/> <http://dorward.me.uk/>
    Home is where the ~/.bashrc is

    Comment

    • Jim Moe

      #3
      Re: MSIE6/Netscape7/Firefox1 CSS problem

      spamfilter@tann erritchie.com wrote:[color=blue]
      >
      > I have set up a simple browser sniffing script which directs the user
      > to a different style sheet in the root directory according to their
      > browser (sitestyle.css for MSIE, mozillastyle.cs s for others), however
      > the Netscape version still does not look how I would like it.
      >[/color]
      So now you must update two files for every one style change. Bummer.
      How would you like it to look? I do not feel like booting to Windows
      just to find out. I suspect I know, and it is doable with a single CSS file.
      [color=blue]
      > The problem area is the left hand vertical navigation bar, where I am
      > using links which change when the mouse pointer is placed over them. In
      > MSIE it looks how I want it. In Netscape I have tweaked it to look
      > adequate, but still not good. The code used in the right hand
      > navigation bar (catalogue) is the same as I use in the MSIE stylesheet,
      > and you can see it creates a real mess.
      >[/color]
      All that and I still do not know what you want besides "look the same."

      --
      jmm dash list (at) sohnen-moe (dot) com
      (Remove .AXSPAMGN for email)

      Comment

      • spamfilter@tannerritchie.com

        #4
        Re: MSIE6/Netscape7/Firefox1 CSS problem

        Dear David,
        Many thanks for the advice. I did actually check it on Opera (which
        seems to behave exactly like IE, and provides IE when userAgent is
        requested in JavaScript), and create a fall back for other browsers.
        I'll plead guilty to not having looked at Konguerer or Safari yet,
        although that's not because I have it in for their users!

        I'm keen to use the best CSS possible, and the hack was a temporary
        solution only. It looks like a different doctype may be the solution -
        which will mean I have to clean up my HTML too. Oh dear.

        Best wishes,
        Fred Smith

        Comment

        • spamfilter@tannerritchie.com

          #5
          Re: MSIE6/Netscape7/Firefox1 CSS problem

          Thanks for the reply. The idea is to use CSS for 'button rollovers' in
          a vertical navigation bar. I have solved half the problem in that I
          realised that I had to set the links to behave as block, not inline.
          Inexperience showing. I am still getting discrepancies though, and
          David Dorward above has suggested doctype.

          Best wishes,

          Fred Smith

          Comment

          • spamfilter@tannerritchie.com

            #6
            Re: MSIE6/Netscape7/Firefox1 CSS problem

            > I also urge you to pick a unit more apropriate for use on the screen[color=blue]
            > for your font sizes then "pt".
            > http://css-discuss.incutio.com/?page=UsingPoints[/color]

            .... oh and point taken (ho ho) about points. I'll convert to ems ...

            FS

            Comment

            • Jim Moe

              #7
              Re: MSIE6/Netscape7/Firefox1 CSS problem

              spamfilter@tann erritchie.com wrote:[color=blue]
              > Thanks for the reply. The idea is to use CSS for 'button rollovers' in
              > a vertical navigation bar. I have solved half the problem in that I
              > realised that I had to set the links to behave as block, not inline.
              > Inexperience showing. I am still getting discrepancies though, and
              > David Dorward above has suggested doctype.
              >[/color]
              What discrepancies?
              The list site David recommended is excellent. A lot a good ideas and
              implementation hints there.
              <http://hsivonen.iki.fi/doctype/> was recommended by Steve Pugh in
              another thread for further doctype info.

              --
              jmm dash list (at) sohnen-moe (dot) com
              (Remove .AXSPAMGN for email)

              Comment

              • kchayka

                #8
                Re: MSIE6/Netscape7/Firefox1 CSS problem

                spamfilter@tann erritchie.com wrote:[color=blue][color=green]
                >> I also urge you to pick a unit more apropriate for use on the screen
                >> for your font sizes then "pt".
                >> http://css-discuss.incutio.com/?page=UsingPoints[/color]
                >
                > ... oh and point taken (ho ho) about points. I'll convert to ems ...[/color]

                Where font-size is concerned, % and em are equivalent, but I recommend
                using % instead, mainly because of some bizarre em behaviors in WinIE.

                --
                Reply email address is a bottomless spam bucket.
                Please reply to the group so everyone can share.

                Comment

                Working...