SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    Object Not Found junjun's Avatar
    Join Date
    Mar 2002
    Location
    northern MI
    Posts
    1,392
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    FF and webkit rendering issue

    http://tinyurl.com/5gxv67

    There is an image, fall_brochure.jpg, which is inserted at the start of the content area of this page through a CMS.

    In IE6/7 the image displays where expected, but in FF and webkit, it's appx 160 px below. I've tried all the tricks I can come up with to even identify if this is a HTML, CSS or JS issue, but to no avail.

    Since FF and webkit both is doing this, I get a sneaking feeling they do it right, and IE is just trying to forgive me and placing it where I want the image.

    The page structure is sound, There's regular CSS hacks that works cross browser. I'm reaching out to my peers and SP experts, what the heck is going on?

  2. #2
    SitePoint Evangelist Ed Seedhouse's Avatar
    Join Date
    Aug 2006
    Location
    Victoria, B.C. Canada
    Posts
    592
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by junjun View Post
    The page structure is sound, There's regular CSS hacks that works cross browser. I'm reaching out to my peers and SP experts, what the heck is going on?
    The page structure is not sound with those 17 html errors. Every html error is an instruction to the browser to do that bit however it prefers. Fix the errors and come back if the problem is still there.
    Ed Seedhouse

  3. #3
    SitePoint Wizard drhowarddrfine's Avatar
    Join Date
    Aug 2005
    Posts
    3,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Is this fixed? Don't see the problem.
    Quote Originally Posted by junjun View Post
    http://tinyurl.com/5gxv67
    Since FF and webkit both is doing this, I get a sneaking feeling they do it right, and IE is just trying to forgive me and placing it where I want the image.
    This is true in all cases.

  4. #4
    Object Not Found junjun's Avatar
    Join Date
    Mar 2002
    Location
    northern MI
    Posts
    1,392
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My fault Ed, I should have been more specific.

    When I say the page structure is sound, I mean that nothing on the page influences the behavior I'm seeing. Ampersands in URL's and deprecated HTML does not change what's happening in FF and webkit. What concerns me is that my testing shows that this is not a CSS or HTML issue.. which is really weird.

    Tommy, Paul OB, anyone seeing this as well?

  5. #5
    Object Not Found junjun's Avatar
    Join Date
    Mar 2002
    Location
    northern MI
    Posts
    1,392
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by drhowarddrfine View Post
    Is this fixed? Don't see the problem.
    Not fixed.. in FF the image displays nest to the headline '9th Annual Bay Harbor Home Tour'm instead of at the top of the content area.

    Quote Originally Posted by drhowarddrfine View Post
    This is true in all cases.
    Absolutely agree.

  6. #6
    #titanic {float:none} silver trophy
    molona's Avatar
    Join Date
    Feb 2005
    Location
    from Madrid to Heaven
    Posts
    8,233
    Mentioned
    239 Post(s)
    Tagged
    1 Thread(s)
    I tried in FF and Google Chrome (which is supposed to be based in webkit) and it looks fine.

    It messes up in Safari for windows and the HTML validator gives 13 errors

  7. #7
    SitePoint Wizard drhowarddrfine's Avatar
    Join Date
    Aug 2005
    Posts
    3,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Add 'overflow:auto' to #toolbox. You're seeing IEs float expansion bug.

  8. #8
    Object Not Found junjun's Avatar
    Join Date
    Mar 2002
    Location
    northern MI
    Posts
    1,392
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by molona View Post
    I tried in FF and Google Chrome (which is supposed to be based in webkit) and it looks fine.
    My fault for not explaining better how it's supposed to look. It might look fine, but if you compared it with IE, you'll see the difference

    Quote Originally Posted by drhowarddrfine View Post
    Add 'overflow:auto' to #toolbox. You're seeing IEs float expansion bug.
    That did it!
    I owe you a beer. You got a conference schedule?

  9. #9
    #titanic {float:none} silver trophy
    molona's Avatar
    Join Date
    Feb 2005
    Location
    from Madrid to Heaven
    Posts
    8,233
    Mentioned
    239 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by junjun View Post
    My fault for not explaining better how it's supposed to look. It might look fine, but if you compared it with IE, you'll see the difference
    I haven't tried IE. Sorry


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
  •