Firefox image and post problems

  • Resolved reevo

    (@reevo)


    18 years, 10 months ago

    Hi all, I’ve just been editing my fies to allow me to wrap text around the images and everything is gone well using the Tamba2 guide @ http://www.tamba2.org.uk/wordpress/graphicalcss/align/index.html

    However, it’s only working properly in Internet explorer and not Firefox where the posts start and finish at the beginning and end of the text while overlapping the images. Very odd.

    Could any Firefox users spread a little light on what on earth is going on please?!

    I’m guessing I need to add something to reinforce that the post should finish at the end of the image and not the end of the text?

    Here’s the code for the latest post if that helps…

    ‘<span style=”float:left;padding:5px;”><img src=”http://www.ektopia.co.uk/ektopia/images/vroombox.jpg&#8221; width=”268″ height=”190″ alt=”” title=”” /></span> Now this is pretty exciting stuff. The VroomBox (currently in development) “utilizes a powerful microprocessor to digitally recreate the sound of your favourite muscle cars, and syncronize them to the engine in your own car. So when you step on the gas, you get the powerful roar of a ’71 Barracuda, a Shelby Mustang, etc. It sounds so realistic, it will blow you (and the guy next to you) away.” My 3 cylinder Corsa’s gonna sound bitching when I get my hands on one of these! [via] ‘

    Thanks for looking in

Viewing 14 replies - 1 through 14 (of 14 total)
  • Mark (podz)

    (@podz)

    18 years, 10 months ago

    I just looked in FF and it looks just as it should.
    Tried a hard refresh ? ctrl-f5

    Mark (podz)

    (@podz)

    18 years, 10 months ago

    On a couple of posts, you have the image ‘breaking through’.
    Try placing the <div id="clearer">&nbsp;</div> at the end of the text.

    Thread Starter reevo

    (@reevo)

    18 years, 9 months ago

    mmm, already tied ctrl/F5 with no joy. the clearer thing doesn’t change it either.

    Maybe it’s a FF version thing? I’m using 1.0.1

    Here’s a link to what it looks like here…

    ‘http://www.ektopia.co.uk/ektopia/images/dodgyffpic.jpg&#8217; and that certainly ain’t the way it should look!!!

    Cheers Podz

    Mark (podz)

    (@podz)

    18 years, 9 months ago

    That’s breakthrough forcing things out of line.
    In your css, do you have this ?

    div.clearer {
    clear: left;
    line-height: 0;
    height: 0;
    }

    Thread Starter reevo

    (@reevo)

    18 years, 9 months ago

    I’ve just added more of the clearer divs to some of the other posts and they do stop the pictures “stacking sideways” like the ones at the bottom of the page. However, the line that goes underneath the whole post to signify its end is cutting through the images above. Very odd.

    I should also mention that it only does it when the page is vied quite wide so you won’t see anything wrong if you’re looking at it under 800px across; resize it though to make it bigger and all will become clear…nastily clear!

    Mark (podz)

    (@podz)

    18 years, 9 months ago

    I’m looking at 1024*768

    The clearer div should solve the problem – it’s purpose is literally to clear everything before the next part starts.
    It’s a case of trying it in a couple of places:
    Immediately after the image but before the text
    On the same line as the end of the text
    At the end of the text but on the next line.

    ‘fraid I can’t test at higher than 800 width ….. 🙁

    Thread Starter reevo

    (@reevo)

    18 years, 9 months ago

    Podz, I do have that including in the CSS, I’ve just checked to make sure that it was saved and transfered to my theme’s folder and it is.

    The altered code is now…

    ‘<span style=”float:left;padding:5px;”><img src=”http://www.ektopia.co.uk/ektopia/images/vroombox.jpg&#8221; width=”268″ height=”190″ alt=”” title=”” /></span> Now this is pretty exciting stuff. The VroomBox (currently in development) “utilizes a powerful microprocessor to digitally recreate the sound of your favourite muscle cars, and syncronize them to the engine in your own car. So when you step on the gas, you get the powerful roar of a ’71 Barracuda, a Shelby Mustang, etc. It sounds so realistic, it will blow you (and the guy next to you) away.” My 3 cylinder Corsa’s gonna sound bitching when I get my hands on one of these! [via] <div id=”clearer”> </div>’

    Have I put the clearer bit in the correct place?

    Thread Starter reevo

    (@reevo)

    18 years, 9 months ago

    I’ll give those placements a try later, gotta go to work. Cheers fella

    Mark (podz)

    (@podz)

    18 years, 9 months ago

    Yes …. but why the span ?
    The page at T2 in the section marked “3. On the right with text wrap” has some CSS which is what I used when creating the page. Have you tried using that ?
    The drop shadow is not important and can be removed.

    Thread Starter reevo

    (@reevo)

    18 years, 9 months ago

    I used the span method becuase I wanted the image on the left. I guess you’re saying that I can do the same thing but change ‘float:right;’ to ‘float:left;’

    I’ll give that a try. Thanks Podz

    Lorelle

    (@lorelle)

    18 years, 9 months ago

    Also check these resources:

    http://codex.wordpress.org/Wrapping_Text_Around_Images
    http://codex.wordpress.org/Using_Images
    http://codex.wordpress.org/CSS_Fixing_Browser_Bugs

    Thread Starter reevo

    (@reevo)

    18 years, 9 months ago

    Thread Starter reevo

    (@reevo)

    18 years, 9 months ago

    Nope, tried that and thought I had it but I was testing in IE which as we know already works!! Doh!

    I think I’ll give it a miss for now and maybe try again when I update my theme to the v1.5 styled themes (using 1.2 style theme at the moment).

    Thanks for the input though people. Much appreciated.

    Thread Starter reevo

    (@reevo)

    18 years, 9 months ago

    Right, spent all evening transferring my old CSS and theme onto the new style 1.5 setup and it all works fine now with the Span thing. So, thanks again for your help.

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘Firefox image and post problems’ is closed to new replies.