SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Addict
    Join Date
    Dec 2008
    Location
    Brussels
    Posts
    377
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    2 column float problem

    Url: http://bulevardi.be/gloom/guestbook.php

    Works fine in FireFox and Safari, gives wrong layout in IE and Opera.

    The two columns should appear left and right of each other. In IE and Opera they appear under each other.

    PHP Code:
    <body>

    <div id="container2">

    <div id="guestbookleft">
    <?php 
    include ("guestbook_fill.php");
    ?>
    </div>

    <div id="guestbookright">
    <?php 
    include ("guestbook_show.php");
    ?>
    </div>

    <div id="footer">&nbsp;</div>

    </div>

    </body>
    Css:
    Code:
    body {
      background-color: transparent;
      font-family: Arial; color: #CCCCCC; font-size: 3mm; 
    }
    
    #container2 { 
      position: relative;
      width: 798px; height: 472px; 
      margin: 10px auto;
      text-align: center;
      border: 1px solid #333333;
    }
    
    #guestbookleft {
      float: left; display: inline; /* fixes the IE bug for margins */
      width: 290px; height: 432px;
      margin: 20px;
      text-align:left;
    }
    
    #guestbookright {
      float: left; display: inline;
      width: 420px; height: 432px; overflow-y: auto; overflow-x: hidden;
      margin: 20px; 
      text-align:left;
    }
    
    #footer {
      clear: both;
    }
    What am I doing wrong ?
    Last edited by bulevardi; May 6, 2009 at 12:24.

  2. #2
    Design Your Site Team bronze trophy Erik J's Avatar
    Join Date
    May 2007
    Location
    Countryside, Sweden
    Posts
    3,407
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This is not a css matter, it is a few typos I think. You seems to have omitted some label closings.

    Html errors can be differently treated in different browsers and validating can be a first step finding the cause of different display.

    Code:
    <form action="http://www.bulevardi.be/gloom/functies.php?fun=gloombook" method="post">
    
    <p><label for="naam">Name: </label><input name="naam" id="naam" type="text" /></p>
    <p><label for="email">E-mail: </label><input name="email" id="email" type="text" /></p>
    <p><label for="website">Website: </label><input name="website" id="website" type="text" value="http://" /></p>
    <p><label for="bericht">Message: </label><textarea name="bericht" id="bericht" maxlength="600"></textarea></p>
    <p><label for="controle">Verification: <img src="../gloom/images/verification.jpg" alt="verification"></label><input name="controle" id="controle" type="text" /></p>
    <p><label for="send"></label><input type="submit" name="send" value="submit"></p>
    <p><label for="datum"></label><input name="datum" class="hidden" id="datum" value="06-05-2009" type="hidden" /></p>
    <p><label for="tijd"></label><input name="tijd" class="hidden" id="tijd" value="15:47:31" type="hidden" /></p>
    <p><label for="ip"></label><input name="ip"  class="hidden" id="ip" value="87.227.9.29" type="hidden" /></p>
    </form>
    Happy ADD/ADHD with Asperger's

  3. #3
    SitePoint Addict
    Join Date
    Dec 2008
    Location
    Brussels
    Posts
    377
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Great thanks!
    Never thought about checking these things there... always thought some little thing in css was wrong.

  4. #4
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    A good practice is to always validate your markup and CSS before any other form of trouble-shooting. Even if you're 110&#37; sure everything is correct. It can save hours of tedious and frustrating debugging.
    Birnam wood is come to Dunsinane

  5. #5
    SitePoint Wizard Blake Tallos's Avatar
    Join Date
    Jun 2008
    Location
    Cuyahoga Falls, Ohio.
    Posts
    1,511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by AutisticCuckoo View Post
    A good practice is to always validate your markup and CSS before any other form of trouble-shooting. Even if you're 110&#37; sure everything is correct. It can save hours of tedious and frustrating debugging.
    Wise words from an very experienced debugger.

    JK Tommy.
    Blake Tallos - Software Engineer for Sanctuary
    Software Studio, Inc. C# - Fanatic!
    http://www.sancsoft.com/


  6. #6
    SitePoint Wizard bronze trophy Black Max's Avatar
    Join Date
    Apr 2007
    Posts
    4,029
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by AutisticCuckoo View Post
    A good practice is to always validate your markup and CSS before any other form of trouble-shooting. Even if you're 110% sure everything is correct. It can save hours of tedious and frustrating debugging.
    One of my students in my very-beginner design class spent a half-hour trying to figure out why half of his page wouldn't display. He finally asked for help (credit to him for trying to first figure it out on his own). Turned out he had left out a closing " in a hyperlink. Why did I find it so fast? Because I, like everyone else who's spent time building sites, had spent my own precious time cursing and sputtering over equally simple, yet catastrophic, errors.

    In other words, Tommy's right. He has a habit of being right, darn his hide.


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
  •