text doesn't float around image in IE7

Posted on 2009-05-18
Medium Priority
Last Modified: 2012-05-07
text does not float afround image in IE7 on xp or windows. Correct behaviour in Firefox or IE 6 or less.


On the main page, in 6 boxes, like "les Seronais", "l'universe bois" etc, the text is not floating corectly around little image, you can see corect behaviour in Firefox
Question by:Darko_Kantic
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2

Author Comment

ID: 24410286
forgot to mention, this site is done using Drupal and zen theme

Expert Comment

ID: 24410296
Try this in lieu of the css assigned to ".right", adjust to your taste:

.right {
margin-left: 100px

Hopefully that's more of what you were looking for...
LVL 42

Accepted Solution

David S. earned 1500 total points
ID: 24410408
It's acting differently in IE7 because ".fp-teaser-text p" has min-height and max-height set. Both of those properties trigger hasLayout which triggers or fixes many IE bugs.

To understand more about what hasLayout is, read this: http://reference.sitepoint.com/css/haslayout

One solution would be to move the ".fp-teaser-image" <div>s inside the ".fp-teaser-text" <div>s.

Author Closing Comment

ID: 31582519
I tried to put ".fp-teaser-image" s inside the ".fp-teaser-text" s. as you suggested but it didn't work, same problem. So I got rid of max and min-height property and the problem disapeared. So I still have to solve problem of making those boxes of same hight.
LVL 42

Expert Comment

by:David S.
ID: 24411099
> I tried to put ".fp-teaser-image" <div>s inside the ".fp-teaser-text" <div>s. as you suggested but it didn't
> work, same problem. So I got rid of max and min-height property and the problem disapeared. So I still
> have to solve problem of making those boxes of same hight.

Sorry. I forgot to add that the min-height and max-height declarations would need to be moved to the rule for ".fp-teaser-text".

You didn't need to create a separate question.

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses
Course of the Month13 days, 14 hours left to enroll

800 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question