Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
  1. #1
    Member
    Join Date
    Aug 2005
    Posts
    87
    Member #
    10945
    Hi, I originally designed my client's website for Internet Explorer, and currently it looks OK. I used plenty of DIV tags, paragraph padding, and other CSS techniques that allowed me to position my flash movie, images, and text. However, my client told me that it was not browser compatible. So I downloaded Mozilla to get the scoop on how it looked and Mozilla almost made me weep because my design was completely out of wack.

    Since then I've fixed the problem of keeping my text from flowing OUTSIDE of the boundaries of its div container, but whenever I make changes that involve a DIV's border or an image inside a div, it looks weird in Mozilla. Also when I make CSS changes in Mozilla, thinking that I'm correcting the problem, I instead make an even bigger problem with the way it looks in Internet Explorer. So I don't know which to choose or if I should write a code that allows the entire webpage to look the same regardless of any browser. Could someone please help me out on this problem? Thanks

  2.  

  3. #2
    Senior Member jbagley's Avatar
    Join Date
    Sep 2004
    Location
    Cape Town
    Posts
    845
    Member #
    7422
    My philosophy regarding browser compatibility and designing is, "Code in Mozilla, and hack to get it right in IE".

    In todays standards, designing a site that works in most browsers is essential.(I say most because there are literally hundreds of browsers, but covering the most popular is essential) And developing using web standards will definitely help you to get your sites working in all standard compliant browsers.

    If you want some help with the site, post us the URL, with some of the exact problems, and I'm sure we can help out.

  4. #3
    Senior Member karinne's Avatar
    Join Date
    Dec 2003
    Location
    Aylmer QC Canada
    Posts
    1,607
    Member #
    4335
    Liked
    8 times
    Like Jason said, "Code for Mozilla, Hack for IE".

    As for your problem, you'll probably need the Box Model Hack but I can't be sure without seeing your site.
    [a web design portfolio - Currently NOT AVAILABLE for work | web design | Re-coding | PSD-to-HTML]
    I'm also on: virb - facebook - twitter - flickr - del.icio.us

  5. #4
    Member
    Join Date
    Aug 2005
    Posts
    87
    Member #
    10945
    Ok, here's an example of no compatibility between browsers.

    I originally designed the page in IE, and my border is seen around the central big image.
    However in Mozilla, the border appears to be cut off, exposing only the left side of the border. I tried to expand the border's CSS structure, but any drastic change I make in Mozilla greatly affects the IE look.

    Also, there is a vertical line on the very right side that borders the entire webpage, and it is flush against the navigation bar. In Mozilla it looks OK, but when I tested it out in IE, the border is moved a couple of spaces to the right.

    http://www.design415.com/constructio...r/Events1.html

  6. #5
    Senior Member jbagley's Avatar
    Join Date
    Sep 2004
    Location
    Cape Town
    Posts
    845
    Member #
    7422
    deffvaltez, the URL you gave seems to give an Http 500 error. Is that the correct URL?

  7. #6
    Member themayanlion's Avatar
    Join Date
    Mar 2005
    Posts
    40
    Member #
    9225
    i also agree with the design for Mozilla, then hack for Firefox.
    There is one quick hack that works, which I use periodically, being the underscore hack.

    Basically, let's say you want to correct display issues, one div would need a different width depending on the browser.

    simply do this

    div {
    width:300px;
    _width:302px;
    }

    i can't remember the reason why, but something in Internet Explorer makes it take the underscoreed value, and ignore the other one, while the other browsers simply ignore the underscored value and take the proper one.

    This eliminates having to use seperate stylesheets, the only thing being that since "_width" isn't a real style, your CSS won't validate, albeit on just a technical level, since it will display properly.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 01:40 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com