1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Debugging IE Layout

Discussion in 'XenForo Development Discussions' started by Moses, Oct 12, 2010.

  1. Moses

    Moses Well-Known Member

    I've been having a few troubles with getting IE6 and 7 to suck less, thought I'd ask if there's any debugging tips to be garnered from the community.

    It would be awesome if there were some kind of firebug for IE, a way to trial new CSS without reloading the page each time.

    My issue is with the header not being aligned vertically to the advert block (screen attached). The code generating my header is

    HTML:
    <div id="header">
        <div class="pageWidth">
            <div class="pageContent">
                <div id="logo"><a href="http://www.greenandgoldrugby.co.za">
                    <span></span>
                    <img src="http://www.greenandgoldrugby.co.za/forum/styles/default/gagrza/icons/gagr_sa_logo.png" alt="Green and Gold Rugby South Africa" />
                    </a>
                </div>
                <div id="gagrzad">
                    <span></span>
    
                    <script type='text/javascript' src='http://partner.googleadservices.com/gampad/google_service.js'>
                    </script>
                    <script type='text/javascript'>
                        GS_googleAddAdSenseService("ca-pub-0383410088051682");
                        GS_googleEnableAllServices();
                    </script>
                    <script type='text/javascript'>
                        GA_googleAddSlot("ca-pub-0383410088051682", "Leaderboard");
                    </script>
                    <script type='text/javascript'>
                        GA_googleFetchAds();
                    </script>
                    <!-- ca-pub-0383410088051682/Leaderboard -->
                    <script type='text/javascript'>
                        GA_googleFillSlot("Leaderboard");
                    </script>
                </div>
        </div>
    </div>
    
    Code:
    #logo {
    display:block;
    float:left;
    height:100px;
    line-height:87px;
    vertical-align:middle;
    }
    
    #logo {
    display:block;
    float:left;
    height:100px;
    line-height:87px;
    vertical-align:middle;
    }
    
    .pageWidth {
    margin:0 auto;
    min-width:853px;
    width:985px;
    }
     

    Attached Files:

    • IE7.PNG
      IE7.PNG
      File size:
      40.9 KB
      Views:
      12
  2. Brogan

    Brogan XenForo Moderator Staff Member

    There is, it's some kind of developer's version.
    I have it installed on my PC.
    Let me see if I can find the link for it.
     
  3. Brogan

    Brogan XenForo Moderator Staff Member

  4. RickM

    RickM Well-Known Member

    If it helps, you can add firebug lite temporarily. If you go on the firebug website it shows you how - its a javascript version, you just add a line to the header and you have firebug in all browsers.
     
    Moses likes this.

Share This Page