#1
  1. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Apr 2001
    Posts
    910
    Rep Power
    0

    Why is text under div?


    Can someone please visit http://www.knowbrockville.com/?gtab=Auction in Firefox it looks fine but in IE the center content is under the right div why?

    Thanks
    Tim
    Daily Deals from Kingston to Brockville and Cornwall Ontario. www.seawaydeals.com
  2. #2
  3. For POny!
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2012
    Location
    Amsterdam
    Posts
    416
    Rep Power
    115
    did you happen to have updated your script?
    in both ie 9,8,7 #centerbox collumn is in between #left and #right, just like in firefox
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2012
    Location
    Stockholm, Sweden
    Posts
    16
    Rep Power
    0
    Originally Posted by timsharpe
    Can someone please visit http://www.knowbrockville.com/?gtab=Auction in Firefox it looks fine but in IE the center content is under the right div why?

    Thanks
    Tim
    Hi timsharpe,

    The thing here is that Firefox and IE does not handle the page output in the same way. IE (usually less than version 8) needs special IE fixes in the CSS.

    In your case it seems to be a positioning issue with IE, have you assigned relative positions to the left, right and centerized elements in your CSS?

    For instance, you could do something like:

    HTML
    Code:
    <div id="page-content">
    <div class="left"></div>
    <div class="center"></div>
    <div class="right"></div>
    </div>
    CSS
    Code:
    * {
    padding: 0;
    margin: 0;
    border: 0;
    outline: 0;
    }
    
    #page-content {
    width: 1200px;
    margin: 0 auto !important;
    }
    
    #page-content .left, 
    #page-content .center, 
    #page-content .right {
    position: relative;
    float: left;
    margin: 5px;
    }
    
    #page-content .left,
    #page-content .right {
    width: 220px;
    }
    
    #page-content .center {
    width: 720px;
    }
    Hope this helped you.
  6. #4
  7. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,126
    Rep Power
    4304
    Welcome to DevShed Forums, Heatleakz.

    Are you aware that reset rules that use the universal selector can cause problems with form controls in some browsers? I recommend you read these:
    http://snook.ca/archives/html_and_css/no_css_reset/
    http://meyerweb.com/eric/thoughts/20...mal-weirdness/

    By the way, new users who have "Reputation Power: 0" can't give you any reputation points yet.
    Spreading knowledge, one newbie at a time.

    Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2012
    Location
    Stockholm, Sweden
    Posts
    16
    Rep Power
    0
    Originally Posted by Kravvitz
    Welcome to DevShed Forums, Heatleakz.

    Are you aware that reset rules that use the universal selector can cause problems with form controls in some browsers? I recommend you read these:
    http://snook.ca/archives/html_and_css/no_css_reset/
    http://meyerweb.com/eric/thoughts/20...mal-weirdness/

    By the way, new users who have "Reputation Power: 0" can't give you any reputation points yet.
    Thanks for the warm welcome, Kravvitz!

    Why do you think people take advantage of placing a simple CSS reset in their stylesheet?

    Basically a CSS reset is always needed and should be placed in the top of the css. The resetting is for progressive enhancement and does not have to cause problems, in fact, most developers (even I) use properties later in the CSS to adjust the form elements. Why do you even think there's a possibility to use your own CSS instead of the browsers built in? Or do you want every site to look the same?

    "Since different browsers have different parameters your site will end up looking different depending on what browser you use."

    CSS Reset (Note: I'm not using the !important override value, values can be adjusted later in the CSS)
    Code:
    * {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    }
    CSS properties for form elements
    Code:
    ul, ol {
    padding: 3px;
    margin: 5px;
    }
    
    form, input, button, select {
    margin: 10px;
    border: 1px;
    }
    It's called "Starting over from scratch".

    I've done many websites with CSS resets and there hasn't been a problem for any of the visitors. However, if it happens that I've forgot the CSS reset and guess what! - The visitors starts complaining over that their IE browser doesn't have the same layout as their Chrome browser. How 'bout that?

    Also, would you consider a CSS reset to decrease performance of a website? Then think over and stop using unneccesary elements or pictures that needs to be loaded.

    PS: I'm not some "reputation troll" or some helpless person who needs reputation points to reclaim self confidence. In fact, I just think that reputation proves that I have given helpful answers and I don't see any problem with stating very simply and nice that people should not hesitate on giving me reputation points. Why do we even have reputation points?

IMN logo majestic logo threadwatch logo seochat tools logo