SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Look ma, no tables (unless you're using IE 5 like half the world)

    Still trying desperately to get my first no-table xhtml1 strict layout playing nicely. Thanks to some sterling help from Mr Ian Glass, I have a basic working model (there are a few errors from where I've been playing, but it's on it's way there).

    www.mattersoffact.co.uk/dev/

    It looks more or less as it should in IE6, Mozilla and Opera. When I sort out the div order I should even be able to get it looking presentable in NS 4.x .... BUT

    IE 5 buggers it up royally!!

    If you have a copy spare, crack it open and you'll see what I mean.

    Any chance one of the guru's here can point me in the right direction for sorting it out? I actually ran through a few toots dotted around the web for this sort of layout last night and even they had probs in IE5 - should I abandon the tableless utopia??
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  2. #2
    ALT.NET - because we need it silver trophybronze trophy dhtmlgod's Avatar
    Join Date
    Jul 2001
    Location
    Scotland
    Posts
    4,836
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I know this isn't what your asking, but this is what it looks like for me (ie6)

  3. #3
    Bimbo With A Brain! silver trophy Saz's Avatar
    Join Date
    Mar 2001
    Location
    Kent, United Kingdom
    Posts
    5,275
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Snap! Only with me it's not centred. That's in IE5.5.

    H, can you keep us up to date with your progress on this site, particularly if you manage to solve your problems. Table-less designs are something I'd really like to get into only I've avoided them thus far because of the compatibility problems.
    Saz: Naturally Blonde, Naturally Dizzy!
    No longer Editor of the Community Crier.

    Don't mind me, I'm having a BLONDE moment!

  4. #4
    Grumpy Mole Man Skunk's Avatar
    Join Date
    Jan 2001
    Location
    Lawrence, Kansas
    Posts
    2,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There are two main issues to take in to account when trying to fix a CSS site to work in IE5:
    1. IE5 ignores margin:auto for centering. In CSS if you want to center a div on the page the suggested method is to apply margin-left: auto and margin-right: auto. IE5 ignores these properties, but luckily it has another bug in that it will (incorectly) apply the text-align attribute to block level elements. So, if you have a <div> inside your <body> that you want centered you can use the following code:
      Code:
      body {
        /* Center the div in IE5 */
        text-align: center;
      }
      body div {
        /* Make sure the contents of the div isn't centered itself */
        text-align: left; 
      }
    2. IE5 gets the "box model" wrong. This issue (and the recommended fix) is best described here: http://www.tantek.com/CSS/Examples/boxmodelhack.html

  5. #5
    + platinum's Avatar
    Join Date
    Jun 2001
    Location
    Adelaide, Australia
    Posts
    6,441
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The circles have dissapeared from the background of the menu and the menu text is about 1 px too high I liked the gradient extending to the bottom of the page too, but anywho...

    It looks really good for a CSS only design kudo's to you H

  6. #6
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by platinum
    The circles have dissapeared from the background of the menu and the menu text is about 1 px too high I liked the gradient extending to the bottom of the page too, but anywho...

    It looks really good for a CSS only design kudo's to you H
    Don't worry sir, your artistic genius is being worked towards - as I said, I'll prolly use the table version until I get this sorted. When it is sorted, circles and gradient should hopefully be in-tact
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  7. #7
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    D - Yep, that's how it should look at the mo. I know some elements look a little quirky, it just hasn't been "tweeked" yet.

    Saz - I'll certainly do that. If I can get this to work out OK I'm going to look at moving all of our corporate sites in this direction.... :nervous: <-!

    Skunk, thanks muchly, I'm working through that toot as I type - prolly gonna start from scratch to ensure all is correct
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  8. #8
    SitePoint Zealot
    Join Date
    Jan 2002
    Posts
    178
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hmm, from what i can see on my screen (using IE6 and 1152x864) some of the pieces are out of line. other than that, it looks nice.
    InQuE

  9. #9
    My precious!!! astericks's Avatar
    Join Date
    Mar 2002
    Location
    Vancouver, BC
    Posts
    1,971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by dhtmlgod
    I know this isn't what your asking, but this is what it looks like for me (ie6)
    same for me. minor misalignments...but pretty good.


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
  •