Cross Browser compatibility question

Discussion in 'HTML' started by tom, Oct 26, 2004.

  1. tom

    tom Guest

    I am learning css and am starting to make headway. However, I occasionally
    get weird results especially with I.E.

    When I create a three column lay out when I first launch it the contents of
    the left column get bumped into the center column! If I do a refresh of the
    page it goes back to the left and stays there. Firefox and firebird never
    have this issue. I have been looking into crossbrowser stuff what is going
    on?

    Ultimately, I would like to be dong this stuff with out help. So if any one
    could recommend a good tutorial on making pages with css look good on "all"
    browsers I would greatly appreciate that also.

    Thanks;
    Tom


    ------ begin html file

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" >
    <head>
    <title>The Charles River Company</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <link rel="stylesheet" href="formating.css" type="text/css" />
    </head>
    <body>

    <div id="pagewidth" >
    <div id="header" >
    <div class="content"> <h1>The Charles River Company</h1> </div>
    </div>
    <div id="outer" >
    <div id="inner">
    <div id="leftcol" >
    <div class="content"> About Us </div>
    </div>
    <div id="maincol" >
    <div class="content"><center> <br><b> The Charles River Company is
    located at:<br>
    1650 South Pacific Coast Highway<br>
    Recondo Beach, CA 90277</b><br></center>
    </div>
    </div>
    <div class="clr"></div>
    </div>
    </div>
    <div id="footer" >
    <div class="content"> Contact Webmaster</div>
    </div>
    <div class="clr"></div>
    </div>
    </body>
    </html>----- end html file----- begin formating.csshtml, body{ margin:0;
    padding:0; } #pagewidth{ width:100%; min-width: 500px; } #header{
    height:80px; width:100%; background-color:#0000C0; color: AliceBlue; }
    #leftcol{ width:180px; float:left; position:relative; margin-left:-180px;
    margin-right:1px; } #outer{ border:solid white 0px; border-left-color:
    #0999FF; border-left-style: solid; background-color: #FFFFFF; width:
    uto; } #footer{ height:45px; width:100%; background-color:#FFFFFF; }
    #inner{margin:0; width:100%;} #maincol{ float: left; width: 100%;
    position: relative; margin: 0 -8px 0 -2px; } #outer>#inner {
    border-bottom: 1px solid #FFFFFF; } .clr{clear:both;}
    ..content{padding:5px;} #header .content{padding-bottom:0;} ----- end
    formating.css
    tom, Oct 26, 2004
    #1
    1. Advertising

  2. tom

    Mark Parnell Guest

    On Mon, 25 Oct 2004 17:38:33 -0700, tom <a> declared in alt.html:

    > I am learning css and am starting to make headway.


    Excellent.

    > However, I occasionally get weird results especially with I.E.


    Don't we all?

    > When I create a three column lay out when I first launch it the contents of
    > the left column get bumped into the center column! If I do a refresh of the
    > page it goes back to the left and stays there. Firefox and firebird never
    > have this issue. I have been looking into crossbrowser stuff what is going
    > on?


    I don't know. URL?

    > Ultimately, I would like to be dong this stuff with out help. So if any one
    > could recommend a good tutorial on making pages with css look good on "all"
    > browsers I would greatly appreciate that also.


    css tutorials and other fun 'n giggly css stuff:
    http://www.css.nu/
    http://www.mako4css.com/
    http://www.richinstyle.com/
    http://www.blazonry.com/css/
    http://www.w3schools.com/css/
    http://www.websitetips.com/css/
    http://www.htmlhelp.com/reference/css/
    http://www.pageresource.com/dhtml/indexcss.htm
    http://www.climbtothestars.org/coding/cssbasic/
    http://www.htmlcenter.com/tutorials/index.cfm/css/
    http://www.freewebmastertips.com/php/content.php3?aid=48
    http://www.canit.se/~griffon/web/writing_stylesheets.html
    http://www.utoronto.ca/ian/books/xhtml2/exerpt/css-4a.html
    http://idm.internet.com/articles/200101/csstutorial1a.html
    http://www.greytower.net/en/archive/articles/tsutsumi.html
    http://www.westciv.com.au/style_master/academy/css_tutorial/
    http://webmonkey.com/authoring/stylesheets/tutorials/tutorial1.html

    layout examples:
    http://www.glish.com/css/
    http://www.csszengarden.com/
    http://www.wannabegirl.org/css/
    http://tantek.com/CSS/Examples/
    http://www.saila.com/usage/layouts/
    http://www.bluerobot.com/web/layouts/
    http://www.benmeadowcroft.com/webdev/
    http://www.xs4all.nl/~apple77/columns/
    http://www.meyerweb.com/eric/css/edge/
    http://www.htmler.org/tutorials/3/1.html
    http://css.nu/articles/floating-boxes.html
    http://webhost.bridgew.edu/etribou/layouts/
    http://www.roguelibrarian.com/lj/index.html
    http://css-discuss.incutio.com/?page=CssLayouts
    http://ecoculture.com/styleguide/r/rollovers.html
    http://thenoodleincident.com/tutorials/box_lesson/index.html
    http://www.webreference.com/authoring/style/sheets/layout/advanced/

    rounded corners:
    http://www.albin.net/CSS/roundedCorners/
    http://www.webweaver.org/dan/css/corners/
    http://www.guyfisher.com/builder/workshop/css/corners/

    slants: http://www.infimum.dk/HTML/slantinfo.html
    centring: http://stone.thecoreworlds.net/www/centre/
    lists: http://www.alistapart.com/stories/taminglists/
    pure css menus: http://www.meyerweb.com/eric/css/edge/menus/demo.html

    master compatibility charts:
    http://www.xs4all.nl/~ppk/css2tests/intro.html
    http://www.blooberry.com/indexdot/css/index.html
    http://macedition.com/cb/resources/abridgedcsssupport.html
    old:
    http://www.immix.net/html/CSSGuide.htm
    http://devedge.netscape.com/library/xref/2003/css-support/

    hiding CSS from crappy browsers:
    http://centricle.com/ref/css/filters/
    http://www.ericmeyeroncss.com/bonus/trick-hide.html
    http://www.w3development.de/css/hide_css_from_browsers/

    css checkers:
    http://jigsaw.w3.org/css-validator/
    http://www.htmlhelp.com/tools/csscheck/

    cascading style sheets, level 1 specification
    http://www.w3.org/TR/REC-CSS1.html
    cascading style sheets, level 2 specification
    http://www.w3.org/tr/rec-css2/cover.html
    cascading style sheets, level 2 revision 1 working draft
    http://www.w3.org/TR/2002/WD-CSS21-20020802/

    (thanks brucie)

    --
    Mark Parnell
    http://www.clarkecomputers.com.au
    "Never drink rum&coke whilst reading usenet" - rf 2004
    Mark Parnell, Oct 26, 2004
    #2
    1. Advertising

  3. tom

    tom Guest

    I am not sure why the css formating suddenly went in the toilet. Let me try
    again.

    html, body{
    margin:0;
    padding:0;
    }

    #pagewidth{
    width:100%;
    min-width: 500px;

    }

    #header{
    height:80px;
    width:100%;
    background-color:#0000C0;
    color: AliceBlue;
    }

    #leftcol{
    width:180px;
    float:left;
    position:relative;
    margin-left:-180px;
    margin-right:1px;
    }

    #outer{
    border:solid white 0px;

    border-left-color: #0999FF;
    border-left-style: solid;
    background-color: #FFFFFF;
    width: auto;
    }

    #footer{
    height:45px;
    width:100%;
    background-color:#FFFFFF;
    }

    #inner{margin:0; width:100%;}

    #maincol{
    float: left;
    width: 100%;
    position: relative;
    margin: 0 -8px 0 -2px;
    }

    #outer>#inner { border-bottom: 1px solid #FFFFFF; }

    ..clr{clear:both;}

    ..content{padding:5px;}

    #header .content{padding-bottom:0;}
    tom, Oct 26, 2004
    #3
  4. tom

    Nik Coughin Guest

    tom wrote:
    > I am not sure why the css formating suddenly went in the toilet. Let
    > me try again.
    >
    > html, body{
    > margin:0;
    > padding:0;
    > }

    <snip>

    Tom, you will find that you will get more help if you provide an url to the
    page in question. If you have to, upload it to a temporary web space of
    some kind.
    Nik Coughin, Oct 26, 2004
    #4
  5. tom

    Neal Guest

    On Tue, 26 Oct 2004 10:40:22 +1000, Mark Parnell
    <> wrote:

    > css tutorials and other fun 'n giggly css stuff:
    > ...
    > (thanks brucie)


    I know full well you were quoting brucie, but seeing "giggly" in your post
    makes me want to laugh...
    Neal, Oct 26, 2004
    #5
  6. tom

    tom Guest


    >
    > Tom, you will find that you will get more help if you provide an url to
    > the page in question. If you have to, upload it to a temporary web space
    > of some kind.


    Sorry here it is http://www.tcpslaship.com/temp/ .

    Thank
    Tom
    tom, Oct 26, 2004
    #6
  7. tom

    tom Guest


    > Sorry here it is http://www.tcpslaship.com/temp/ .
    >
    > Thank
    > Tom


    Hmmm, that is odd. When I bring up the page locally it always screws up the
    first time. I uploaded it to the web and it looks fine! ARGH!

    I just tried it locally again and it still messes up. How bizarre!


    Tom
    tom, Oct 26, 2004
    #7
  8. "tom" <a> wrote;
    > I am not sure why the css formating suddenly went in the toilet. Let me try


    URL?

    --
    Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
    Lauri Raittila, Oct 26, 2004
    #8
  9. tom

    Mark Parnell Guest

    On Mon, 25 Oct 2004 20:53:38 -0400, Neal <> declared in
    alt.html:

    > I know full well you were quoting brucie, but seeing "giggly" in your post
    > makes me want to laugh...


    What, not something you think I'd say? :)

    --
    Mark Parnell
    http://www.clarkecomputers.com.au
    "Never drink rum&coke whilst reading usenet" - rf 2004
    Mark Parnell, Oct 26, 2004
    #9
  10. tom

    Mark Parnell Guest

    Mark Parnell, Oct 26, 2004
    #10
  11. tom

    Neal Guest

    On Tue, 26 Oct 2004 11:18:04 +1000, Mark Parnell
    <> wrote:

    > On Mon, 25 Oct 2004 20:53:38 -0400, Neal <> declared in
    > alt.html:
    >
    >> I know full well you were quoting brucie, but seeing "giggly" in your
    >> post
    >> makes me want to laugh...

    >
    > What, not something you think I'd say? :)


    You're not the 'giggly' type...
    Neal, Oct 26, 2004
    #11
  12. tom

    Mark Parnell Guest

    On Mon, 25 Oct 2004 21:33:07 -0400, Neal <> declared in
    alt.html:

    > You're not the 'giggly' type...


    That's what you think. :-D

    --
    Mark Parnell
    http://www.clarkecomputers.com.au
    "Never drink rum&coke whilst reading usenet" - rf 2004
    Mark Parnell, Oct 26, 2004
    #12
  13. tom

    brucie Guest

    In alt.html tom said:

    > Hmmm, that is odd. When I bring up the page locally it always screws up the
    > first time. I uploaded it to the web and it looks fine! ARGH!


    on occasions IE will display pages differently when they're local.
    usually involves margins and padding.

    --
    brucie{display:nude;}
    brucie, Oct 26, 2004
    #13
  14. brucie wrote:

    > In alt.html tom said:


    >> Hmmm, that is odd. When I bring up the page locally it always screws up the
    >> first time. I uploaded it to the web and it looks fine! ARGH!


    > on occasions IE will display pages differently when they're local.
    > usually involves margins and padding.


    Any theories on why that would happen?

    --
    Blinky Linux Registered User 297263

    Go Blue
    Blinky the Shark, Oct 26, 2004
    #14
  15. tom

    Mark Parnell Guest

    On 26 Oct 2004 04:33:42 GMT, Blinky the Shark <>
    declared in alt.html:

    > Any theories on why that would happen?


    Microsoft.

    --
    Mark Parnell
    http://www.clarkecomputers.com.au
    "Never drink rum&coke whilst reading usenet" - rf 2004
    Mark Parnell, Oct 26, 2004
    #15
  16. tom

    brucie Guest

    In alt.html Mark Parnell said:

    > (thanks brucie)


    you owe me royalties

    --
    brucie{display:nude;}
    brucie, Oct 26, 2004
    #16
  17. tom

    Mark Parnell Guest

    On Tue, 26 Oct 2004 17:09:32 +1000, brucie <>
    declared in alt.html:

    > you owe me royalties


    You'll have to come visit. ;-)

    --
    Mark Parnell
    http://www.clarkecomputers.com.au
    "Never drink rum&coke whilst reading usenet" - rf 2004
    Mark Parnell, Oct 26, 2004
    #17
  18. tom

    brucie Guest

    In alt.html Blinky the Shark said:

    >> on occasions IE will display pages differently when they're local.
    >> usually involves margins and padding.


    > Any theories on why that would happen?


    evilness

    --
    brucie{display:nude;}
    brucie, Oct 26, 2004
    #18
  19. tom

    brucie Guest

    In alt.html Mark Parnell said:

    >> you owe me royalties


    > You'll have to come visit. ;-)


    i'll drive down on the weekend. i cant wait to meet the dead bitch that
    stole you from me.. ummm... did i say that out loud .... i mean your
    lovely wife.

    --
    brucie{display:nude;voice-family:'many little';speech-rate:x-fast;}
    brucie, Oct 26, 2004
    #19
  20. tom

    Sid Ismail Guest

    On Mon, 25 Oct 2004 17:38:33 -0700, "tom" <a> wrote:

    : I am learning css and am starting to make headway. However, I occasionally
    : get weird results especially with I.E.
    :
    : When I create a three column lay out when I first launch it the contents of
    : the left column get bumped into the center column!


    You are missing a </td> somewhere, I imagine.

    URL?

    Sid
    Sid Ismail, Oct 26, 2004
    #20
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Replies:
    7
    Views:
    11,900
    Juan T. Llibre
    Mar 15, 2006
  2. =?Utf-8?B?cHJvZl9tYXJ0aW4=?=

    Cross-browser compatibility of Asp.net v.1.1 & 2.0

    =?Utf-8?B?cHJvZl9tYXJ0aW4=?=, Apr 25, 2006, in forum: ASP .Net
    Replies:
    1
    Views:
    3,586
    Juan T. Llibre
    Apr 25, 2006
  3. jb
    Replies:
    16
    Views:
    704
    Toby A Inkster
    Dec 8, 2003
  4. Sally Thompson
    Replies:
    8
    Views:
    565
    Sally Thompson
    Jun 19, 2004
  5. =?ISO-8859-1?Q?L=FCpher_Cypher?=

    Cross-browser compatibility

    =?ISO-8859-1?Q?L=FCpher_Cypher?=, Jan 5, 2006, in forum: HTML
    Replies:
    2
    Views:
    456
    kchayka
    Jan 5, 2006
Loading...

Share This Page