/    Sign up×
Community /Pin to ProfileBookmark

Webpage content (font/layout) changed in different browsers

Hi,

I am designing a new website using Camino. The problem I am having is that my bio page looks fine in some browsers, but the text on the page is resized and the layout is changed in other browsers. Is there some sort of scrip I can embed so that the layout (font and any other variables) on my pages stays constant regardless of the browser (it was that way when I designed it through iWeb, but that program has other issues with it).

Regarsd,

MM

to post a comment
HTML

3 Comments(s)

Copy linkTweet thisAlerts:
@tracknutJul 12.2009 — Unfortunately there is no such magic script to make all browsers display the exact same thing. The best route is more like:

  • 1. Write good clean code that validates the [url=http://validator.w3.org/]w3c validator[/url]

  • 2. Test your initial solution on a compliant browser (Firefox, typically)

  • 3. Test your code against the other browsers and make adjustments as necessary

  • 4. Implement browser-dependent conditions at a last resort, to make the page work on the more esoteric browsers


  • Dave
    Copy linkTweet thisAlerts:
    @CharlesJul 12.2009 — Web pages are supposed to display differently on different platforms. It that excites you then you are in the right place. If that fills you with dread then you need a different medium--PDF, perhaps.
    Copy linkTweet thisAlerts:
    @LiteTestJul 12.2009 — Are you using fixed size for fonts?

    I find the best way of dealing with this is to test my pages in all different browsers from the get go, that way I can check the page for every update I do.

    On another note, you can use specific syle sheets for different browsers:

    for example:

    <!--[if IE 6]>

    <link rel="stylesheet" type="text/css" href="styles/ie6style.css" />

    <! [endif] -->

    that will only load the IE6 stylesheet in IE. (I took the snippet from here:

    http://www.designerstalk.com/forums/help-me/30744-different-css-different-browsers.html)
    ×

    Success!

    Help @manya23 spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 BETA 6.17,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @nearjob,
    tipped: article
    amount: 1000 SATS,

    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,

    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,
    )...