Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder Partizan's Avatar
    Join Date
    Dec 2008
    Location
    Legoland and Ireland
    Posts
    139
    Thanks
    74
    Thanked 0 Times in 0 Posts

    IE - firefox layout conflict

    Hi all,

    When I check this page in IE it looks different than in Firefox.

    http://www.minifigtimes.com/news-legoland.shtml

    In IE the main body (Images and their related text) are way down the page.

    Is there something wrong with my code does anyone know?

    PHP Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <
    html lang="en">
    <
    head>
    <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <
    title>The Minifig Times for all your Lego News</title>
    <
    link rel="shortcut icon" href="http://www.minifigtimes.com/images-site/icon.ico">
    <
    link rel="stylesheet" type="text/css" href="default.css">
    <
    meta name="description" content="A Lego news blog providing an insight into the crazy world of deranged Legomen otherwise known as minifigs.">
    <
    meta name="abstract" content="The Minifig Times provides Lego news from the town, city, castle, pirates, train, space, technic and western themes.">
    <
    meta name="robots" content="index,follow">
    <
    meta name="googlebot" content="index,follow">
    <
    meta name="Content-Script-Type" content="text/javascript">
    <
    meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!--
    Second copy of the script-->
    <
    script type="text/javascript"
    <!--
    var 
    img2 = new Array();
    var 
    caption2 = new Array();
    var 
    path2 "http://www.minifigtimes.com/"
     
    img2[0] = path2 "news/2009/images/nib-city-1.png"
    caption2[0] = "Politics: Emperor David has sent an open letter to the minifigs of Rulandstin expressing his sympathy after the state was devastated following a powerful hurricane last week. <br><br> The Emperor said that all government ministers in Legoland would hold a minute silence on Monday as a mark of respect for minifigs killed in the PBR. Meterologists reported that Hurricane April reached Category 5.";   
     
    img2[1] = path2 "news/2009/images/nib-minifig-alan-mcmanus-1.png";
    caption2[1] = "Sport: Greentown Athletic have been sold to Green Islander businessfig Mr Alan McManus for a £45m fee. The club will play their first game under new ownership when they entertain Parma at the Athletic Ground. <br><br>Former owner, Higginsland businessfig Mr Primus Stove, is expected to use the £8.75m profit from the sale to bid for another club, with Serie B side Foggia understood to be a target.";
     
    img2[2] = path2 "news/2009/images/nib-s16c-1.png";
    caption2[2] = "Sport: Organisers for the new Super 16 Conference have said that the prize monies available to the participating clubs is likely to be in the region of £160m. <br><br> Teams that qualify from the group stage are set to net £10m, with the semi finalists each earning £15m. The runners-up will land £20m whilst the overall winners will pocket £30m and a chance to earn even more in the Pan Continental Superbowl.";
     
    img2[3] = path2 "news/2009/images/nib-minifig-emperor-david-1.png";
    caption2[3] = "Business: Emperor David has revealed he will not bankroll the redevelopment of the capital despite donating £45m in the last month. <br><br> Speaking to the parliament, the supreme leader of the Third Empire explained that the worsening state of the economy was also hitting his finances and he has no more money to give and in fact may soon be off to his local State Economic Bureau to collect social welfare payments. ";
     
     
    // Add more images here
     
    function changeIMG2(direction) {
     
      var 
    current=document.images.nextpic2.src;
        
      for (var 
    0;i<img2.length;i++) {
        if(
    img2[i]==current) {
          if(
    direction=="forward") {
            if(
    i==img2.length-1) {
              
    swap2(0);
            }
            else {
              
    swap2(i+1);
            }
          }
          if(
    direction=="back") {
            if(
    i==0) {
              
    swap2(img2.length-1);
        }
            else {
              
    swap2(i-1);
            }
          }
          break;
        }
      }
    }
     
    function 
    swap2(nr) {
      
    document.images.nextpic2.src=img2[nr];
      
    document.getElementById("imgcaption2").innerHTML=caption2[nr];
    }
     
    //-->
    </script>
     
    <!--End of Second Copy of Script-->
    </head>
    <body>
    <div class="filler-menu">
      <img src="http://www.minifigtimes.com/images-site/the-minifig-times.png" alt="The Minifig Times">
    </div>
     
     
    <div class="pd_menu_01"> 
    <ul><li><a href="/">Home</a>
    </li></ul>
     
    <ul><li><a href="http://www.minifigtimes.com/news-legoland.shtml">News</a>
    <ul>
    <li><a href="http://www.minifigtimes.com/news-legoland.shtml">Legoland</a></li>
    <li><a href="http://www.minifigtimes.com/news-international.shtml">International</a></li>
    </ul>
    </li></ul>
     
    <ul><li><a href="http://www.minifigtimes.com/football.shtml">Sport</a>
    <ul>
    <li><a href="http://www.minifigtimes.com/football.shtml">Serie A</a></li>
    <li><a href="http://www.minifigtimes.com/football-more.shtml">Serie B</a></li>
    <li><a href="http://www.minifigtimes.com/football-s16c.shtml">Super 16 Conference</a></li>
    </ul>
    </li></ul>
     
     
    <ul><li><a href="#">Resources</a>
    <ul>
    <li><a href="http://www.minifigtimes.com/football-downloads.shtml">Downloads</a></li>
    <li><a href="http://www.minifigtimes.com/search.shtml">Search</a></li>
    </ul>
    </li></ul>
     
    </div>
    <p>
    <img src="http://www.minifigtimes.com/images-site/the-minifig-times-is-hiring.png" class="farright" alt="The Minifig Times is hiring!">
    </p>
     
     <h4 class="story-headline-top">Home news</h4>       
        <div class="img right" style="border: 0px solid black; padding: 20px; float: right; width: 250px; max-width: 250px;">
           
     
    <br>
    <br>
    <p class="section-headers-page">News in brief</p>
    <img name="nextpic2" src="http://www.minifigtimes.com/news/2009/images/nib-city-1.png" class="farright" onclick="changeIMG2();" alt="LEGO news">
     <p id="imgcaption2" style="width: 100%; margin-top:0;">  
    Politics: Emperor David has sent an open letter to the minifigs of Rulandstin expressing his sympathy after the state was devastated following a 
    powerful hurricane last week. <br><br> The Emperor said that all government ministers in Legoland would hold a minute silence on Monday as a mark 
    of respect for minifigs killed in the PBR. Meterologists reported that Hurricane April reached Category 5.
    </p>
    <a href="#" onclick="changeIMG2('forward');return false;" class="link-next-picture">More News in brief...</a>
    <!-- MAXIMUM LENGTH OF STORY TEXT #################################################################################################### -->
     
    <div class="left" style="border: 0px solid black; padding: 0px; float: left; width: 550px; max-width: 550px;">
    <br>
    <p class="section-headers-page">Latest society news</p>
     
    <p class="no-space-above">
    <a href="http://www.minifigtimes.com/news/2009/2009-04-08-story01.shtml" class="link-news">Riot errupts in Legoland City centre after arrest...</a>
    </p>
     
    <p class="no-space-above">
    <a href="http://www.minifigtimes.com/news/2009/2009-03-25-story01.shtml" class="link-news">Dickus labels General Secretary an "idiot"...</a>
    </p>
     
    <p class="no-space-above">
    <a href="http://www.minifigtimes.com/news/2009/2009-03-10-story01.shtml" class="link-news">Council unveals proposals for capital redesign...</a>
    </p>
     
    <p class="no-space-above">
    <a href="http://www.minifigtimes.com/news/2009/2009-02-23-story01.shtml" class="link-news">Nation's third largest bank collapses...</a>
    </p>
     
    <p class="no-space-above">
    <a href="http://www.minifigtimes.com/news/2009/2009-02-20-story01.shtml" class="link-news">Calls for government to resign...</a>
    </p>
     
    </div>   
    <!-- MAXIMUM LENGTH OF STORY TEXT #################################################################################################### -->
     
    <div class="left" style="border: 0px solid black; padding: 0px; float: left; width: 550px; max-width: 550px;">
     
    <p class="section-headers-page">Latest sports news</p>
     
    <p class="no-space-above">
    <a href="http://www.minifigtimes.com/news/2009/2009-02-28-story01.shtml" class="link-news">Loko loses first game in charge to Lazio...</a>
    </p>
     
    <p class="no-space-above">
    <a href="http://www.minifigtimes.com/news/2009/2009-02-24-story01.shtml" class="link-news">Marino sack Aldridge after club slips...</a>
    </p>
     
    <p class="no-space-above">
    <a href="http://www.minifigtimes.com/news/2009/2009-02-23-story02.shtml" class="link-news">LFC president Hagi announces his retirement...</a>
    </p>
     
    <p class="no-space-above">
    <a href="http://www.minifigtimes.com/news/2009/2009-02-21-story01.shtml" class="link-news">Van Basten let go by LFC as United go top...</a>
    </p>
     
    <p class="no-space-above">
    <a href="http://www.minifigtimes.com/news/2009/2009-02-18-story01.shtml" class="link-news">Van Basten on last legs as LFC dumped out...</a>
    </p>
     
    </div>  
     
      </div>
      
      
     <p>    
    Recent news from Legoland is shown below and arranged in chronological order with the most recent stories first.
    </p>
     
     
     
     
     
     
    <div>
    <div class="subwrapper news-stories-grid-top">
        <div>
            <img src="http://www.minifigtimes.com/images-2009/news/2009-04-06-p1.png" alt="LEGO news">
            <p>
            <a href="http://www.minifigtimes.com/news/2009/2009-04-06-story01.shtml" class="link-read-story">
            BFB celebrate as patron clears club's debts
               </a>
     
                   </p>
           </div>
        <div class="mid">
            <img src="http://www.minifigtimes.com/images-2009/news/2009-03-25-p1.png" alt="LEGO news">
            <p>
            <a href="http://www.minifigtimes.com/news/2009/2009-03-25-story01.shtml" class="link-read-story">
            Dickus labels General Secretary an "idiot"
               </a>
                   </p>
     
        </div>
         <div>
            <img src="http://www.minifigtimes.com/images-2009/news/2009-03-10-p1.png" alt="LEGO news">
            <p>
            <a href="http://www.minifigtimes.com/news/2009/2009-03-10-story01.shtml" class="link-read-story">
            Council unveals proposals for capital redesign
               </a>
                   </p>
        </div>      
     
    </div>      <!-- sub wrapper Div end -->
    </div>
     
     
     
    <div>
    <div class="subwrapper news-stories-grid-top">
        <div>
            <img src="http://www.minifigtimes.com/images-2009/news/2009-03-01-p1.png" alt="LEGO news">
            <p>
            <a href="http://www.minifigtimes.com/news/2009/2009-03-01-story01.shtml" class="link-read-story">
            No butts or maybes as Boškov is shown the door
            </a>
            </p>
            
        </div>
        
        <div class="mid">
        
            <img src="http://www.minifigtimes.com/images-2009/news/2009-02-28-p1.png" alt="LEGO news">
            <p>
            <a href="http://www.minifigtimes.com/news/2009/2009-02-28-story01.shtml" class="link-read-story">
            Loko loses first game in charge to manager-less Lazio
            </a>
            </p>
        
        
        </div>
        
        <div>
            <img src="http://www.minifigtimes.com/images-2009/news/2009-02-24-p1.png" alt="LEGO news">
            <p>
            <a href="http://www.minifigtimes.com/news/2009/2009-02-24-story01.shtml" class="link-read-story">
            Marino sack Aldridge after club slips closer to drop
            </a>
            </p>
        </div>   
                
    </div>      <!-- sub wrapper Div end -->
        
    </div>    
     
     
     
     
     
    <div>
    <br>
    <br>
    <br>
     
    <a href="http://www.minifigtimes.com/news/2009/archive-news-legoland-1.shtml" class="link-standard">Next Page</a>
        
    </div> 

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,853
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Your way of creating a 2 column layout is not so good, I'd say, and there for your layout is suffering from the box model bug of IE.

    To make a 2 column layout, apply a width+float on one of the column elements(preferably the smaller one), and then apply a suitable margin-right/left to the other one, depending upon the position. Also, always take care while applying width/padding/margin to he inner elements of your columns.

    Refer http://bonrouge.com/2c-hf-fluid(r).php (setting a width:76%; on the #wrap would give you a layout which is almost similar to yours)

    Code:
    body {/*default.css (line 17)*/
    background-color:#FFFAFA;
    font-family:"calibri";
    font-size:90%;
    margin-left:12%;
    margin-right:12%;
    }
    Avoid setting margin/width/padding directly on the html or body tags. Add a wrapper div instead and apply those styles on it.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

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