Internet Explorer padding issues in horizontel list

Discussion in 'CSS' started by Tintumol, Dec 13, 2010.

  1. #1
    I have a horizontel list as my menu with a 1px border to the right of each item as a seperator. Each item has 10px padding to the left and right. In all browsers it shows up as expected in the middle of the menu items but in Explorer the border is way closer to the right, almost pushed up against the item to the right. Any help please.
     
    Tintumol, Dec 13, 2010 IP
  2. CSM

    CSM Active Member

    Messages:
    1,047
    Likes Received:
    25
    Best Answers:
    0
    Trophy Points:
    55
    #2
    Give us an URI to the website please, thanks.
     
    CSM, Dec 13, 2010 IP
  3. iulzi

    iulzi Peon

    Messages:
    110
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    A simple tips and to get css validation, is to create another css file only for ie6/7, and change the padding/margin of that id/class.
     
    iulzi, Dec 13, 2010 IP
  4. CSM

    CSM Active Member

    Messages:
    1,047
    Likes Received:
    25
    Best Answers:
    0
    Trophy Points:
    55
    #4
    In this case you mean conditional comments... yep, that's one way. It depends on the layout itself if they are needed or not ;)

    Gracias
     
    CSM, Dec 13, 2010 IP
  5. Raymond_M

    Raymond_M Peon

    Messages:
    79
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    I think you can actually just switch the padding settings to margins. So if your padding-left and padding-right are 10px, then set them to 0 and then set your margin-right and margin-left to 10px. I believe that will fix the problem, with cross-browser compatibility
     
    Raymond_M, Dec 14, 2010 IP
  6. animebuzz.tv

    animebuzz.tv Peon

    Messages:
    317
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #6
    try add this attribute in your class : left:0px!important;
     
    animebuzz.tv, Dec 15, 2010 IP
  7. Raymond_M

    Raymond_M Peon

    Messages:
    79
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #7
    If you do use the !important as suggest, I would add a clear, easy to find comment next to it so you remember it later if you have to edit it that style again. It can cause serious headaches if you don't keep track of your !important attribute, or use them improperly.
     
    Raymond_M, Dec 15, 2010 IP
  8. sguduru

    sguduru Greenhorn

    Messages:
    25
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    11
    #8
    sguduru, Mar 16, 2011 IP