IE6 and FF discrepancy with side navigation menu

Discussion in 'CSS' started by driven, Nov 4, 2006.

  1. #1
    Guys/gals,

    On this site, i can't seem to figure out what is causing the issue with the left side navigation menu. If you look it in IE, you'll see the blue border pushed out to the right where as in FF, it is supposed to be where it should be. Any thoughts on what is causing this issue?
     
    driven, Nov 4, 2006 IP
  2. jascele

    jascele Peon

    Messages:
    48
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Try adding this into your stylesheet:

    * html #navmenu li {margin-left: -16px; }
     
    jascele, Nov 5, 2006 IP
    driven likes this.
  3. driven

    driven Well-Known Member

    Messages:
    400
    Likes Received:
    14
    Best Answers:
    0
    Trophy Points:
    138
    #3
    Well, that is one to do this. So thanks for the advice. the problem is that this discrepancy didn't occur until recently. I'm not sure if it's because of some javascript files that I uploaded and this occured or what. I'd like to know what the origin of this problem is for IE as it wasn't there a few days ago.
     
    driven, Nov 6, 2006 IP
  4. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #4
    May or may not be related to your issue, but you have float and absolute position on several elements concurrently. The two are exclusionary, with AP trumping float.

    Too, your stylesheet organization is haphazard. It is difficult to determine just which rulesets may be over-riding others. In Marine parlance, it's a cluster****.

    cheers,

    gary
     
    kk5st, Nov 6, 2006 IP
  5. driven

    driven Well-Known Member

    Messages:
    400
    Likes Received:
    14
    Best Answers:
    0
    Trophy Points:
    138
    #5
    KK5ST- Thanks for the constructive critiscm about it being cluster**** :)

    I was unaware that float and absolute are exclusive of each other. Are there articles that would educate me why they are exclusive of each other?

    can you give me an example from my stylesheet of where it is clustered? thanks.
     
    driven, Nov 6, 2006 IP
  6. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #6
    I don't know of a specific statement in the specs regarding float vs. AP (though, there likely is something :)), but give it a bit of thought. How can a float element be positioned absolutely? In the converse, how can an AP element float? The in practice result is that given both properties, an element will act as AP.

    When I speak of haphazard organization, I mean there is no apparent order to the style rules. I see simple elements scattered throughout the stylesheet. There are same #id'd selectors in multiple places.

    The cascade means that later or more specific selector rules override earlier or less specific selectors. Without some degree of order, it is difficult to have a sense which selector set is doing what to which—hence the Marine Corps terminology.

    It appears you're somewhat breaking things down according to whether the rule deals with font, color, &c. I believe that is asking for trouble. Besides the difficulty in maintenance, debugging is more difficult.

    The better way is to organize by context. Put all simple elements first. Any elements for which you want to specify the rules belong at the head of the stylesheet. This sets, along with browser defaults that you don't counter, the default values for the elements. Follow this with general classes. See? We're getting more specific as we build the stylesheet. Finally the #id'd contexts.

    By using that ordering, it is a simple matter to look first at the element and then drop down to the class or id that contains that element for possible overrides. You'll know exactly what applies and what doesn't. There is no chance of another rule somewhere confusing the issue.

    cheers,

    gary
     
    kk5st, Nov 7, 2006 IP