Web Analytics Made Easy -
StatCounter CSS left margin not working in ie 7 - CodingForum

Announcement

Collapse
No announcement yet.

CSS left margin not working in ie 7

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • CSS left margin not working in ie 7

    Hi There;
    I am relatively new to css and am having a big problem. My left margin is showing up fine in all browsers including ie8 but it put my navigation images in the center of the page in ie7. I have been searching google for hours and trying many suggestions I have found, but nothing I have tried fixes it. Can anyone tell me what I am doing wrong here?

    This is my css

    Code:
    #div4 { 
    	background-image: url(plank.gif);
    	background-repeat: no-repeat;
    	height: 36px;
    	width: 136px;
    	position: relative;
    	top: 300px;
    	left: -15px;
    	
    }
    Here is the html:

    Code:
    <div id="div4">Home</div>

  • #2
    Code:
    #div4 {
    	margin-right: auto;
    	margin-left: auto;
    	background-image: url(plank.gif);
    	background-repeat: no-repeat;
    	height: 36px;
    	width: 136px;
    	position: relative;
    	top: 300px;
    
    }
    try using this

    Comment


    • #3
      Can anyone tell me what I am doing wrong here?
      We don't get anything useful from the above posted html/css. Could you post a link?
      Digitalocean Cloud Hosting (Referral link - get $10 free credit) Fameco

      Comment


      • #4
        Thanks for your help, the first suggestion did not work. The link is
        http://andersonranch.sasktelwebsite.net

        Comment


        • #5
          When I view the CSS file linked on the site, it's empty.
          .My new Javascript tutorial site: http://reallifejs.com/
          .Latest article: Calculators — Tiny jQuery calculator, Full-fledged OOP calculator, Big number calculator
          .Latest quick-bit: Including jQuery — Environment-aware minification and CDNs with local fallback

          Comment


          • #6
            I am so sorry about that, I was trying a few things but my filezilla at work overwrote the css file with a blank one. I have reuploaded it and the css file is there now. Please try again.
            Last edited by countrygirl; Apr 15, 2009, 09:31 AM.

            Comment


            • #7
              Your problem is the "text-align:center" in the body. Internet Explorer incorrectly uses text-align to center block elements (your ".sidelinks" divs).

              A working solution would be to delete the positioning stuff from .sidelinks and instead put div4 - div7 in a wrapping div, which you can position absolutely. And maybe add "position:relative;" to your containing div (#div3), so that the absolute position of the sidelink wrapper is relative to that, and not relative to the whole viewport.
              .My new Javascript tutorial site: http://reallifejs.com/
              .Latest article: Calculators — Tiny jQuery calculator, Full-fledged OOP calculator, Big number calculator
              .Latest quick-bit: Including jQuery — Environment-aware minification and CDNs with local fallback

              Comment


              • #8
                try it on firefox

                Comment

                Working...
                X