467,075 Members | 995 Online
Bytes | Developer Community
Ask Question

Home New Posts Topics Members FAQ

Post your question to a community of 467,075 developers. It's quick & easy.

HELP: Float Left box is drifting to the right in ie!

HELP: Float Left box is drifting to the right in ie!

--------------------------

I need som HELP with my CSS coding!

On the following web page my design falls apart at screen size 800 x
600 (looks fine at larger screen sizes) when the left menu box that
should float left is drifting to the right in Internet Explorer 6.0 (it
doesn't drift to the right in Netscape 7.1).

http://www.rivendellfarm.net/photos.html

Please view the home page to see how the left menu should look on all
the pages.

Home page URL: http://www.rivendellfarm.net/

I know it has something to do with the larger images in the center of
the page.

Is there a way to fix this problem? Please don't tell me I have to
stick with
small sized images on the page.

CSS page is: http://www.rivendellfarm.net/rivende...stylesheet.css

#left { /*left menu box */
position: relative;
top:0;
left:0;
background: #AA202D;
color: #E0D4BB;
float:left;
width: 170px;
font-size: .8em;
margin-left: -5%; /* the difference to make the left column appear
flush left */
}

I tried removing the negative percentage left margin value on the left
float box, (see above) but that didn't help move the menu box back to
where it belongs.

I tried to position the left menu box as absolute as shown below in the
CSS coding:

#left {
position: absolute;
top:0;
left:0;
background: #AA202D;
color: #E0D4BB;
float:left;
width: 170px;
font-size: .8em;
margin-left: -5%; /* the difference to make the left column appear
flush left */
}

In Internet Explorer 6.0 that worked. I now had the left menu box
staying where it should no matter what the screen size.
BUT in Netscape 7.1 the left menu box was at the top left hand size of
the screen and over some because of the negative percentage left margin
value!

So then I tried the relative position as shown in the CSS coding
below...

#left {
position: relative;
top:0;
left:0;
background: #AA202D;
color: #E0D4BB;
float:left;
width: 170px;
font-size: .8em;
margin-left: -5%; /* the difference to make the left column appear
flush left */
}

This made the left menu box behave in Netscape 7.1 BUT now Internet
Explorer 6.0 is drifting the box over to the right once again!

HELP! What is the answer or is there an correct answer to this drifting
box problem?

Suggestions needed!

This is the reason tables look so good to so many of us! BUT I know one
should try to wean themselves away from table based web site design.

Help me not go back to tables. Thanks!

Please read ove my CSS coding very carefully, it maybe that I have
something wrong with it.
_________________
--- A Love for Horses ~ www.alove4horses.com ---

Jan 27 '06 #1
  • viewed: 1745
Share:

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by MyNameIsnt | last post: by
4 posts views Thread by MooMaster | last post: by
3 posts views Thread by charchap | last post: by
1 post views Thread by innivive@gmail.com | last post: by
reply views Thread by richard12345 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.