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
    Junior Member
    Join Date
    Sep 2010
    Posts
    2
    Member #
    23958
    My site looks pretty good in Google Chrome and Safari.

    However, it is all messed up in FireFox!

    I'm not sure as to why it is like that, but I welcome any tips!

    http://techtubemedia.com/release/test/

    This is just a beta of my final site. I have valid html (all expect the YouTube player).

    Are the tables rendered differently in each browser?

    sorry for my lack of knowledge :S This is my first ever coded site!

    p.s. I am aware of the randomly placed 'hidden' div element sporting a menu. This is from a previous design, will get rid of it soon.

  2.  

  3. #2
    Unpaid WDF Intern TheGAME1264's Avatar
    Join Date
    Dec 2002
    Location
    Not from USA
    Posts
    14,483
    Member #
    425
    Liked
    2783 times
    img {border: none;}

    If you want your text to fit in those boxes, the only sure way to do it is to embed the text into the images themselves.
    If I've helped you out in any way, please pay it forward. My wife and I are walking for Autism Speaks. Please donate, and thanks.

    If someone helped you out, be sure to "Like" their post and/or help them in kind. The "Like" link is on the bottom right of each post, beside the "Share" link.

    My stuff (well, some of it): My bowling alley site | Canadian Postal Code Info (beta)

  4. #3
    Member jwind's Avatar
    Join Date
    Nov 2010
    Location
    On a mac
    Posts
    76
    Member #
    24894
    Liked
    4 times
    That's just the way it is. FF, webkit, IE all use different algorithms when rendering text size. Not to mention how far the users browser has to travel down your CSS font stack before finding one that exists locally on their machine.

    You just have to design for this accordingly and like Thegame said, use an img with the text where is absolutely crucial that your text renders exactly across all browsers.

    FWIW, I find that FF almost always renders txt just a little bit bigger then that of a webkit based browser (chrome/safari). As does IE... YMMV...

  5. #4
    Junior Member Liam Kenneth's Avatar
    Join Date
    Mar 2011
    Location
    London, United Kingdom
    Posts
    9
    Member #
    27123
    You should use CSS resets then you wouldt have this problem.

    Code:
    /* http://meyerweb.com/eric/tools/css/reset/
       v2.0 | 20110126
       License: none (public domain)
    */
    
    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td,
    article, aside, canvas, details, embed,
    figure, figcaption, footer, header, hgroup,
    menu, nav, output, ruby, section, summary,
    time, mark, audio, video {
        margin: 0;
        padding: 0;
        border: 0;
        font-size: 100%;
        font: inherit;
        vertical-align: baseline;
    }
    /* HTML5 display-role reset for older browsers */
    article, aside, details, figcaption, figure,
    footer, header, hgroup, menu, nav, section {
        display: block;
    }
    body {
        line-height: 1;
    }
    ol, ul {
        list-style: none;
    }
    blockquote, q {
        quotes: none;
    }
    blockquote:before, blockquote:after,
    q:before, q:after {
        content: '';
        content: none;
    }
    table {
        border-collapse: collapse;
        border-spacing: 0;
    }

  6. #5
    Member jwind's Avatar
    Join Date
    Nov 2010
    Location
    On a mac
    Posts
    76
    Member #
    24894
    Liked
    4 times
    Well, ya, you should. But you are still going to run into situations where there is a variance.

    Quote Originally Posted by Liam Kenneth, post: 200708
    You should use CSS resets then you wouldt have this problem.

    Code:
    /* http://meyerweb.com/eric/tools/css/reset/
       v2.0 | 20110126
       License: none (public domain)
    */
    
    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td,
    article, aside, canvas, details, embed,
    figure, figcaption, footer, header, hgroup,
    menu, nav, output, ruby, section, summary,
    time, mark, audio, video {
        margin: 0;
        padding: 0;
        border: 0;
        font-size: 100%;
        font: inherit;
        vertical-align: baseline;
    }
    /* HTML5 display-role reset for older browsers */
    article, aside, details, figcaption, figure,
    footer, header, hgroup, menu, nav, section {
        display: block;
    }
    body {
        line-height: 1;
    }
    ol, ul {
        list-style: none;
    }
    blockquote, q {
        quotes: none;
    }
    blockquote:before, blockquote:after,
    q:before, q:after {
        content: '';
        content: none;
    }
    table {
        border-collapse: collapse;
        border-spacing: 0;
    }

  7. #6
    Junior Member Liam Kenneth's Avatar
    Join Date
    Mar 2011
    Location
    London, United Kingdom
    Posts
    9
    Member #
    27123
    The only thing that will mess about is IE but that's standard I always use CSS resets and I never have a problem where text is shown larger or smaller in diff browsers


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
  •  

Search tags for this page

my html 5 page looks horrible on ie 10

,

why are my html tables messed up in chrome

Click on a term to search for related topics.
All times are GMT -6. The time now is 10:22 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com