• Locked
1 reply [Last post]
Wed, 2010-06-02 14:25
ts24
ts24's picture
Offline
newbie
Enschede
Last seen: 13 years 2 days ago
Enschede
Timezone: GMT+2
Joined: 2010-06-02
Posts: 1
Points: 2

Hi there,

I'm working on a website for a company. Most of the code was already available, but I had to do a lot of changing little things, like margins en padding's.

But I'm stuck on a problem with IE7.
Firefox.jpg
ie7.jpg
If you look at the images above you can clearly see the problem.
I've got 3 columns 

#col1{float:left;width:204px;min-height:500px;margin-right:10px;margin-left:30px;position:relative;top:-50px;}
#col1_content{padding:1px 0 0 5px;}
#col2{float:right;width:220px;margin-right:20px;position:relative;top:-100px;}*html #col2{width:220px;overflow:hidden;}
#col2_content{padding-top:1px;}
#col3{width:505px;margin-left:204px;margin-right:220px;padding-top:20px;overflow:hidden;}*html #col3{width:560px;margin-left:200px;margin-right:216px;overflow:hidden;}

In firefox I've got them in place by putting an top:-50px and an top:-100px; in the code.
This doesn't work in IE7. But how can I fix this problem in IE7?

Does anyone have thoughts?

(If you need more code, this is the website: www.groeneguru.nl)

Thank you!

Hanneke Perik

Top
Tags:
Fri, 2010-06-04 10:26
#1
Panda
Panda's picture
Offline
Enthusiast
UK
Last seen: 12 years 48 weeks ago
UK
Timezone: GMT+1
Joined: 2010-04-25
Posts: 98
Points: 110

Don't use positioning if

Don't use positioning if you're going to float.

Also, this is the code I pulled from your site:

#col1{float:left;width:204px;min-height:500px;margin-right:10px;margin-left:30px;position:relative;top:-50px;margin-top:100px\9;}

This isn't exactly the same as what you have above, though I guess you might be playing with it a bit. Try changing it to the following:

#col1{
  float:left;
  width:204px;
  min-height:500px;
  margin-right:10px;
  margin-left:30px;
  margin-top:50px;}

Top
  • Locked