paragraph alignment issue across browsers

Discussion in 'HTML & Website Design' started by sixrfan, Jun 28, 2011.

  1. #1
    how come when you view this site in firefox it looks fine. but when you view it in chrome, you'll notice that the line of text that starts as "When you spend close to" appears about the "About Car Wash World" image instead of just below it?

    It should read "When you spend close to 40yrs in the Car Wash industry..."

    And when you look at the code, its part of the same paragraph, so what gives?

    
    <p><img src="/wp-content/uploads/car-wash-about.jpg" alt="From Ira Feinberg, the Dean of Clean" title="About Car Wash World" width="660" height="33" class="alignleft size-full wp-image-39" /></p> 
    
    <p>When you spend close to 40yrs in the Car Wash Industry and have cleaned over 2 million cars, you learn a thing or two about washing cars. Ira Feinberg, The Dean Of Clean, has spent the last thirty-nine years involved in <img src="/wp-content/uploads/dean-of-clean.jpg" alt="Car Wash Guru" title="Ira Feinberg - Dean of Clean" width="161" height="133" class="alignleft size-full wp-image-35" />every aspect of the Car Wash Industry from owning and operating a chain of full service car washes, giving seminars for operators, consulting for numerous car wash clients, designing unique systems to clean and detail cars, establishing the first school to train car wash operators… (<a href="/blog1/about-us">Read more…</a>)</p>
    
    Code (markup):
    please advise. thanks in advance. asdf.jpg
     
    sixrfan, Jun 28, 2011 IP
  2. Trix

    Trix Peon

    Messages:
    192
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    0
    #2
    float : left in the following css is creating the problem...

    .alignleft, img.alignleft {
    display: inline;
    float: left;
    margin-right: 24px;
    margin-top: 4px;
    }

    removing it might cause alignment issues with images using this class... so be careful.....

    Or u need to clear the float

    And most of the float used where not cleared..... which makes the html too improper/incorrect... this might cause problems in IE or other windows and mobile browsers........
     
    Last edited: Jun 28, 2011
    Trix, Jun 28, 2011 IP
  3. sixrfan

    sixrfan Well-Known Member

    Messages:
    354
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    101
    #3
    i'm pretty sure i need the float: left to get this section of pics to line up but i'm not sure how i would clear them all if they all need to be lined up against one another???
     
    sixrfan, Jun 28, 2011 IP
  4. sixrfan

    sixrfan Well-Known Member

    Messages:
    354
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    101
    #4
    actually removing the float from the "About Car Wash World" image worked. i thought i had to take it off the images above that.
     
    sixrfan, Jun 28, 2011 IP