SitePoint Sponsor

User Tag List

Results 1 to 16 of 16
  1. #1
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    doctypes, quirks, and browser misbehaviour

    Wow - I read Tommy's June piece about HTML/ XHTML - excellent, and yet a bit too much for me as a newcomer. My head hurts but here goes!

    Dreamweaver seems to be automatically creating new pages for me in XHTML 1.0 Transitional. It puts the <?xml...> gubbins at the top which I think throws IE6 into quirks mode. I found this out over a day tryig to work to why IE6 seems no longer to understand the box model. Or why Moz will not render font: shorthand declarations any more. And generally why my css font sizing was not working or was different between browsers!!

    Plus, dreamweaver templates put template comments at the top of the page, which again, if I understand right, will throw IE 6 into quirks mode, and implement the IE5 box model whilst ignoring the famous hack!

    I never thought I'd be spending the day tying to understand DOCTYPES but any suggestions would be extremely welcome. Thanks guys

  2. #2
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    When you create a new page in Dreamweaver, there's a checkbox that controls whether it uses XHTML 1.0 Transitional or HTML 4.01 Transitional. Make sure that it's unchecked if you want to avoid the 'XHTML' problems.

    IIRC, Dreamweaver will use an incomplete doctype declaration for HTML 4.01 Transitional, so you may still have problems with quirks mode unless you add the system identifier (URI). There's probably some file you can edit to fix it permanently, but I've never investigated it.
    Birnam wood is come to Dunsinane

  3. #3
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    reverting

    Thanks Tommy, I think I'll try going back to 4.01 Transitional. Probably have to revert a few days to an earlier design. And work out why pages that use templates don't always have a comment at the top that triggers IE6 quirks mode. Appreciate the suggestion

  4. #4
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    recovery

    Thanks, will try that - am having trouble reverting to an earlier status at the moment (I want to go back because of the risk that I corrupted the page fiddling with doctypes and xhtml markup and stuff I don't fully understand)

  5. #5
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by all4nerds
    Why not use a strict DTD
    It takes some tweaking to persuade Dreamweaver to add a Strict doctype declaration, and even if you do, it will not hesitate to pollute your markup with presentational elements and attributes that won't validate outside Transitional. (If you work in design mode, that is.)
    Birnam wood is come to Dunsinane

  6. #6
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK - have got back to 4.01 Transitional, and I don't have that stuff at the top of the page or quirks mode box problem any more. You were right about the checkbox - i'd not spotted that; thanks Tommy. Don't seem to have to be Strict, thanks all4

    NOW I'm trying to work out why IE6 won't show the first bullet image in a ul. Moz is fine. Life is full of nice surprises

  7. #7
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    And Moz still does not understand shrthand. Weird

  8. #8
    bronze trophy
    Join Date
    Dec 2004
    Location
    Sweden
    Posts
    2,670
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    More specifically, transitional doctypes at best trigger Almost Standards mode in Mozilla, Opera and Safari, while strict doctypes trigger Full Standards mode. The main difference has to do with vertical sizing of table cells ("Almost" follows the traditional way of shrink-wrapping images and "Full" follows the CSS way of honoring the height of the line box).
    Simon Pieters

  9. #9
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Can you show us the font shorthand that you're having problems with?
    Birnam wood is come to Dunsinane

  10. #10
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks guys. Have not been online much today - still trying to get everything working. hey-ho, I guess I'm learning, but slowly. There are still some funnies, and for some reason moz still won't read this shorthand but goes to a large default? h1 style. I found that by accident, and that's why I put in the longhand (I have tried various sizes and units - this is how it ended up with the shorthand commented out).
    It's a sunny day here and I'm going out for beer now - back on the case tomorrow :-)
    You know it makes sense

    h1, .strap {
    font-weight: bold;
    font-style: italic;
    font-size: 0.8em;
    line-height: 1.1;
    /*font: italic bold .9em/1.1em; moz does not read shorthand !!*/
    color: #f90;
    margin: 0px;
    padding: 0px;

  11. #11
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I did remember the closing bracket by the way!!

  12. #12
    bronze trophy
    Join Date
    Dec 2004
    Location
    Sweden
    Posts
    2,670
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The 'font' shorthand requires <'font-family'> to be specified, so Mozilla is correct to drop the declaration.
    Simon Pieters

  13. #13
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes, font must contain font-size and font-family. The other properties are optional.
    Birnam wood is come to Dunsinane

  14. #14
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Simon and Tommy. I have wasted a lot of time on this.... I'll go back and straighten it out

    So what's the learning? I went back to my Sam's CSS guide which says explicitly 'all of these values do not need to be included in a shorthand declaration'! the fonts guide at w3c validator offers the following examples:

    P { font: 12pt/14pt sans-serif }
    P { font: 80% sans-serif }
    P { font: x-large/110% "new century schoolbook", serif }
    P { font: bold italic large Palatino, serif }
    P { font: normal small-caps 120%/120% fantasy }
    P { font: oblique 12pt "Helvetica Nue", serif; font-stretch: condensed }

    No too many font-families there either. So how do you find out about these things? How do you avoid the pain? Any suggestions gratefull accepted, but in the meantime, thank you and I will do what you suggest

  15. #15
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There's at least one font family specified in each of those rules (sans-serif, serif, fantasy, "new century schoolbook", Palatino, "Helvetica Nue").

    For the font shorthand property:
    • font-size is required
    • font-family is required (one or more, comma-separated)
    • font-style is optional
    • font-variant is optional
    • font-weight is optional
    • line-height is optional


    Actually, the CSS2.1 specification allows you to use certain keywords (caption, icon, menu, message-box, small-caption, status-bar) or inherit instead. Those cannot be combined with any of the other properties.
    Birnam wood is come to Dunsinane

  16. #16
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Tommy. I guess I'm going blind and I was scanning for a longer family string

    Anyway, you are right and the css validates when the family is specified

    Best wishes

    Rob


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •