Difficulties with IE: floating images and hover block

  • motionmountain
  • Beginner
  • Beginner
  • motionmountain
  • Posts: 51

Post 3+ Months Ago

I have a simple website that provides a free
physics textbook for all. On my mac, the site
looks exactly as I want it. But on IE6 on PCs,
many things go wrong.
(the site is http://www.motionmountain.net )

All problems are related to the css in
http://www.motionmountain.net/motionmountain.css

Changing the "position: relative" to
"position: absolute" in the code below, which describes the middle,
main column, has almost no effect
on the mac, but dramatic effects on the PC:

Code: [ Select ]
.content {
    position:relative; /* in PCs: gives strange floating problems */
    z-index:1000;
    left:150px;
    margin:0px;
    margin-right:415px; /* for PCs */
    padding-top:46px;
    padding-left:120px;
    padding-right:10px;
    padding-bottom:20px;
    width:auto;
    text-align:left;
    font-family:Verdana,Tahoma,Arial,Helvetica,Sans,Gill,sans-serif;
    font-size:0.7em;
    line-height:1.5;
    color:black;
    background-image:url(IMAGES/pic2.gif) ;
    background-position:left top;
    background-repeat:no-repeat;
}
  1. .content {
  2.     position:relative; /* in PCs: gives strange floating problems */
  3.     z-index:1000;
  4.     left:150px;
  5.     margin:0px;
  6.     margin-right:415px; /* for PCs */
  7.     padding-top:46px;
  8.     padding-left:120px;
  9.     padding-right:10px;
  10.     padding-bottom:20px;
  11.     width:auto;
  12.     text-align:left;
  13.     font-family:Verdana,Tahoma,Arial,Helvetica,Sans,Gill,sans-serif;
  14.     font-size:0.7em;
  15.     line-height:1.5;
  16.     color:black;
  17.     background-image:url(IMAGES/pic2.gif) ;
  18.     background-position:left top;
  19.     background-repeat:no-repeat;
  20. }

On PCs, on the home page,
"position relative" makes the outer two menus behave
in the way I want (hovering works over the whole block,
not only when the pointer is on the text) but in
exchange, the effect is lost on the red "download
the text" line.

On PCs, the position of the left lower graph changes,
depending on whether I set position:relative
or position:absolute on the middle column.

On the page http://www.motionmountain.net/text.html ,
the right image float behind the text on IE6, but
float perfectly on firefox.

The same problem happens with the pdf and zip icons.

Obviously, I am not understanding something here.
Can somebody explain all this to me?

Thank you a lot in advance!

Christoph
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • RedBMedia
  • Proficient
  • Proficient
  • User avatar
  • Posts: 315

Post 3+ Months Ago

Lwt me first say that I love the concept for your site! Physics is one of my favorite subjects! And free information is AWESOME!

I am not completely sure of what might be causing your problems. But I would like to ask why you are using the "position" variable at all? when i do a three column display I make the left and right column with fixed width and float them left and right. I then make the center column with a fixed width and then "margin: auto 0;" to center it. All of that can be done below a header DIV.

And to be honest, I am not entirely sure what all your problems are because I use firefox exclusively! But I hope youget these issues worked out, although i will enjoy your site despite that!
  • digitalMedia
  • a.k.a. dM
  • Genius
  • User avatar
  • Posts: 5149
  • Loc: SC-USA

Post 3+ Months Ago

You must have fixed this. I don't see the problem. I looked on IE7, IE6 and FF.
  • motionmountain
  • Beginner
  • Beginner
  • motionmountain
  • Posts: 51

Post 3+ Months Ago

That is strange - I have not fixed anything; and the IE6 display I saw today
was really bad.

Christoph
  • digitalMedia
  • a.k.a. dM
  • Genius
  • User avatar
  • Posts: 5149
  • Loc: SC-USA

Post 3+ Months Ago

I see it now. I wasn't looking at text.html. Sorry
  • motionmountain
  • Beginner
  • Beginner
  • motionmountain
  • Posts: 51

Post 3+ Months Ago

The issues seem to be related to haslayout. I managed to correct most of them.

Christoph Schiller

Post Information

  • Total Posts in this topic: 6 posts
  • Users browsing this forum: No registered users and 77 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.