SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Wizard lukeurtnowski's Avatar
    Join Date
    Mar 2003
    Location
    Coronado
    Posts
    1,666
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)

    Help nuddging element only in IE browser

    I need some help nudging an element (container) down only in my IE browser, I like the look that the top 2 elements are connected to the below div (container) in the firefox browser. In my style sheet, I tried
    * html #container {
    height: 10 px;
    }
    which seemed to effect only the FF browser and not IE.
    http://www.lukesplace.com/GBF/index.php
    Thanks
    "Oh, and Jenkins--apparently your mother died this morning."

  2. #2
    SitePoint Zealot ChestRockwell's Avatar
    Join Date
    Nov 2003
    Location
    New Jersey
    Posts
    195
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You need to have 2 containers in you CSS like this:
    #container {
    height :14px;
    }
    * html #container {
    height: 10px;
    }

    the first one will effect IE but, IE wont see the * html style....so....IE wont be effected...but...FF will see those changes and then just appy them...so it will work in both browsers.
    -- Joe C --
    "Do or do not. There is no try..."
    - Yoda

  3. #3
    SitePoint Wizard lukeurtnowski's Avatar
    Join Date
    Mar 2003
    Location
    Coronado
    Posts
    1,666
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    This is really confusing to me.
    The site has a div named container which includes the navbar on down. In IE it has to be mover down a smidgen in order to fil the cart div. So I tried a few methods and I'm not sure of the correct method to achieve this effect (I'm not trying to be difficult...I sort of am slow when it comes to this)
    "Oh, and Jenkins--apparently your mother died this morning."

  4. #4
    SitePoint Zealot ChestRockwell's Avatar
    Join Date
    Nov 2003
    Location
    New Jersey
    Posts
    195
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No problem...the above code should do it for you. In this:
    Code:
       #container {
       height : FOR IE
       }
    height should equal the height or the margin you need for IE...
    In here...
    Code:
       * html #container {
          height: 10px;
       }
    In this one...you set the heights and margins for FireFox.

    This is the best way to do it I think....there are other ways...this is just how I do it.

    IE and FF and Safari all have different margins and different settings. One of the pains when starting with CSS is cross browser compatibility issues
    -- Joe C --
    "Do or do not. There is no try..."
    - Yoda

  5. #5
    SitePoint Wizard lukeurtnowski's Avatar
    Join Date
    Mar 2003
    Location
    Coronado
    Posts
    1,666
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    I thought height refers to the height of that element and I thought it has nothing to do with the margin,
    or does IE not recognize margins so you just create a seperate div to act as a margin and give it the height you would like the top margin to be
    "Oh, and Jenkins--apparently your mother died this morning."

  6. #6
    SitePoint Wizard lukeurtnowski's Avatar
    Join Date
    Mar 2003
    Location
    Coronado
    Posts
    1,666
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    #container {
    height :14px;
    }
    * html #container {
    height: 10px;
    }
    In this example, can you explain why the container div has a height of 14px,, isnt that thin (cm) and why you would like it to be 4 pixels thicker in IE only?
    Thanks...
    "Oh, and Jenkins--apparently your mother died this morning."

  7. #7
    SitePoint Zealot ChestRockwell's Avatar
    Join Date
    Nov 2003
    Location
    New Jersey
    Posts
    195
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    sorry....my example was not ment to be anything real...it was just ment to show you how to use the * html hack...
    -- Joe C --
    "Do or do not. There is no try..."
    - Yoda


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •