Not signed in (Sign In)

SkillShare - A place to discuss Web Standards and Web Design topics

Categories

Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.

Browser Specific Problems: Safari problem with images and floats

Bottom of Page

1 to 2 of 2

  1.  
  1.  permalink
    I'm having a very odd problem with Safari. Load the following very simple code, making sure to use any image that's portrait-format, i.e. it's taller than it is wide.

    <html>
    <img src="PATH/TO/IMAGE.jpg" />
    <p style="float:left">testword</p>
    </html>

    In Firefox, Opera, IE6, and IE7, this displays the image with the word 'testword' underneath it, against the left edge of the window.

    In Safari, though, the word 'testword' is at the top left of the browser window, pushing the image away from the left edge.

    I've tried trashing Safari preferences, and logging in from another account: same problem. Does anyone know anything about this? Can you reproduce it?

    (By the way, the behavior's the same when I use a properly formatted HTML document with <head> and <body> tags, an external stylesheet, etc.)
  2.  permalink
    Safari sometimes goes quirky when you mix inline (img) and block (p) elements closely.

    Safari should play along if you add style="display: block;" to the img:

    <html>
    <img src="PATH/TO/IMAGE.jpg" style="display: block;" />
    <p style="float:left">testword</p>
    </html>

1 to 2 of 2

  1.  
Add your comments
    Username Password
  • Format comments as (Help)
 
Back to Discussions Top of Page