First CSS web site

Discussion in 'Web Design and Development' started by Dane D., May 6, 2010.

  1. Dane D. macrumors 6502a

    Joined:
    Apr 16, 2004
    Location:
    ohio
    #1
    My first CSS web site is underway. I'm teaching myself CSS on this site. My concern is IE6 and above, they don't render properly. The CSS and html passed W3's Validators. But I'm stuck as to what is causing my body copy on this page not to show up in IE. http://www.covey-odell.com/peebee/html/aboutus.html. Any tips or suggestions would be appreciated. Thank you.
     
  2. 7on macrumors 601

    7on

    Joined:
    Nov 9, 2003
    Location:
    Dress Rosa
    #2
    Why are you using a Transitional doctype?
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

    That triggers quirks mode which switches IE to render in non-standards mode.
     
  3. Dane D. thread starter macrumors 6502a

    Joined:
    Apr 16, 2004
    Location:
    ohio
    #3
    Thanks for the quick reply, what should it be? I'm still in the dark about doc types and what they mean. If I change the doc type, will it still work in the other browsers? Pardon my lack of knowledge, I'm learning CSS by trial and error and lots of reading.
     
  4. Cabbit macrumors 68020

    Cabbit

    Joined:
    Jan 30, 2006
    Location:
    Scotland
    #4
    From a design standpoint the big problems i see are with your typography:
    The body type is hard to read, maybe tone down the shade to #666.
    The colour of the navigation font makes my eyes water.
    Overall the text is difficult to read, so i can't enjoy the content.
     
  5. citizenzen macrumors 65816

    Joined:
    Mar 22, 2010
    #5
    You gotta watch the kerning on your P's.

    What's P aper?
     

    Attached Files:

  6. SrWebDeveloper macrumors 68000

    SrWebDeveloper

    Joined:
    Dec 7, 2007
    Location:
    Alexandria, VA, USA
    #6
    The "DOCTYPE" begins the HTML document and tells a validator like the one you used which version of HTML to use in checking syntax. The W3C defines these things, it's the consortium that sets many major standards used on the web, along side the WDG (web design group).

    There are many doctype's out there, but for purposes of this conversation there are two important ones:

    HTML:
    <!DOCTYPE HTML PUBLIC  "-//W3C//DTD HTML 4.01//EN"
     "http://www.w3.org/TR/html4/strict.dtd">
    and

    HTML:
    <!DOCTYPE HTML PUBLIC  "-//W3C//DTD HTML 4.01 Transitional//EN"
     "http://www.w3.org/TR/html4/loose.dtd">
    The first uses HTML 4.01 strictly, which means your code must strictly conform to that HTML specification. The second also uses HTML 4.01, but also allows certain deprecated elements and additional attributes. And, as the other user noted, browser manufacturers feel they can do their own thing when this doc type is specified, i.e. MSIE quirks mode for CSS and HTML.

    Generally strict is the way to go for best cross browser compatibility, but of course is very restrictive during validation. Newbies should be aware of this. Beginners also often don't realize there even are standards, they learn HTML maybe from reading books or studying code snippets where strict syntax is rarely taken into consideration. Combine that with MSIE in quirks mode, you see the problem.

    But that's one way to go to help you in your rendering issues, ultimately. The other ways include experience and time learning how this all works! You made the first step - you asked. Google the rest and visit sites like these to learn more:

    http://htmlhelp.com/reference/html40/alist.html
    http://htmlhelp.com/tools/validator/doctype.html

    -jim
     
  7. Dane D. thread starter macrumors 6502a

    Joined:
    Apr 16, 2004
    Location:
    ohio
    #7
    Thank you, that helps me understand.
    This was given to me by the client, we didn't develop the art. Unfortunately, all the art was done by someone else, my job is to somehow bring all this together. I've studied many books on CSS and am picking it up fairly quickly.
     
  8. citizenzen macrumors 65816

    Joined:
    Mar 22, 2010
    #8
    Yes, clients will give you a pile of crap and ask for you to turn it into gold.

    That said, an eye for good typesetting is a valuable skill to possess.
     
  9. Dane D. thread starter macrumors 6502a

    Joined:
    Apr 16, 2004
    Location:
    ohio
    #9
    Switched to 'Strict' doctype, but my body copy still doesn't appear in IE. :(
     

Share This Page