Solved

text doesn't float around image in IE7

Posted on 2009-05-18
5
416 Views
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.

Site:
http://espace.agirlocal.com

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
0
Comment
Question by:Darko_Kantic
  • 2
  • 2
5 Comments
 

Author Comment

by:Darko_Kantic
ID: 24410286
forgot to mention, this site is done using Drupal and zen theme
0
 
LVL 7

Expert Comment

by:thiyaguk
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...
0
 
LVL 42

Accepted Solution

by:
David S. earned 500 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.
0
 

Author Closing Comment

by:Darko_Kantic
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.
0
 
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.
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Image Orientation On Website 6 44
css, html 6 31
Best Practice CSS floating images 2 16
increase words that display in widget 6 20
When applying CSS to your HTML, there are many different ways to select which element(s) the CSS applies to.  Some of these selectors are more commonly known and used than others - Here are the more common ones: #X - Matches an ID of X .X - Matche…
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

760 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

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now