SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    SitePoint Addict
    Join Date
    Mar 2003
    Location
    Greenville, SC
    Posts
    388
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Firefox 3.0 rendering differently then 3.5 (but the same as ie8)

    Hello Guys,

    I ran all of my tests on Firefox 3.5, IE7 & 6, but when I showed it to my client they happened to be using Firefox 3.0 and IE8.

    Anyways, I'm having a tough time fixing my issue for these two browsers.

    Please view it here:
    http://www.zero1productions.com/hirato/videos.php

    The problem is that the titles drop below behind the content on these browsers. I have no idea how to target two separate versions of firefox that renders differently.

    Thanks for any help.

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,165
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    Which titles drop below which content? I'm not clear on what's happening.

  3. #3
    SitePoint Addict
    Join Date
    Mar 2003
    Location
    Greenville, SC
    Posts
    388
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hey Ralph, the titles "Ergonomically correct & Accurate", "36 Led Light", "accurate Angle Everytime" and the "left & right hand shears" titles. The are the titles for all of the paragraphs. In Firefox 3.0 and IE8 they are dropping where the paragraph text is.

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,165
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by jive View Post
    they are dropping where the paragraph text is.
    On FF3.5, Safair and IE8 those titles are the same for me. Do you mean that you want the titles above the paragraph and image?

  5. #5
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    I can't replicate this on my FF .
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  6. #6
    SitePoint Addict
    Join Date
    Mar 2003
    Location
    Greenville, SC
    Posts
    388
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey guys,

    I appreciate you willingness to help. I have uploaded Screenshots. The first is Firefox 3.0 (with the titles dropping into the text) the Second is Firefox 3.5 (this is how it should display)




    Firefox 3.5:

  7. #7
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,165
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    Hmm, I can't test this either, but you could try altering your styles to this (new style in blue):

    Code:
    .thumbContent p {
    	font: 12px arial;
    	width: 220px;
    	float: right;
    	margin: 15px 7px 0px 0px;
    }
    
    .thumbContent a, .thumbContent img {float:left;}

  8. #8
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    I don't feel like installing FF3.0

    So here we go with a blind guess . On ".thumbContent p" give that clear:right; and on ".thumbContent img" give that float:left;
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  9. #9
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello!

    I'm using FF 3.0.15 -- i can see the error
    using IE 6.0 -- no error found

    This is same as our problem before but I could not remember what was our developer did in solving.

  10. #10
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by joan.lopez View Post
    Hello!

    I'm using FF 3.0.15 -- i can see the error
    using IE 6.0 -- no error found

    This is same as our problem before but I could not remember what was our developer did in solving.
    When an inline element comes before a float the spec doesn't specify whether it should be all on the same line or it should drop. I think that's the issue which is why I told the OP to float the image .
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  11. #11
    SitePoint Addict
    Join Date
    Mar 2003
    Location
    Greenville, SC
    Posts
    388
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    this worked. Fixed it for all three:

    ".thumbContent p" give that clear:right; and on ".thumbContent img" give that float:left;"

    Way to go Ryan!

  12. #12
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by jive View Post
    this worked. Fixed it for all three:

    ".thumbContent p" give that clear:right; and on ".thumbContent img" give that float:left;"

    Way to go Ryan!
    Glad to hear that .
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work


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
  •