Cross browsing issue - FF v IE7 - Please help 1

[Pav1977]

Hi guys this is the usual, I'm totally stuck on this and would really appreciate any help you could give.

This is example of my problem - I have this on other sites too.

<div id="nav_strip_blue">
<div class="float_right" >
<a href="#SkipNav" title="Skip navigation" accesskey="s"><span>Skip navigation</span></a><span>|</span>
<a href="

http://www.bifm.org.uk/bifm/home"

target="_blank">BIFM HOME</a><span>|</span>
<a href="

http://www.fm-world.co.uk"

target="_blank">FM WORLD HOME</a><span>|</span>
<a href="/Contact_form.asp">CONTACT US</a>
</div>
</div>




#nav_strip_blue A {
COLOR: #fff;
text-decoration:none;
font-size:90%;
height: 22px;
vertical-align:middle;
text-align:center;
padding: 4px 5px 0px 5px;
background-color:#2a327a;
display:inline-block;
display: -moz-inline-box; /*the line causing the problem*/
margin-left: 15px;
border-left:#2a327a solid 1px;
border-right:#2a327a solid 1px;
font-weight:bold;
}

There was a problem with FF inline-box display (not lineing it correctly in FF) which I fixed with the: display: -moz-inline-box;
line.
So now it works in IE 6 and FF but not in IE7
Here is the link,

http://www.bifmconference2007.com/

Anyone has any ideas? I'd really appreciate as I'm totally stuck on it.

Cheers

 

[Vragabond]

The page looks the same (OK) on both FF and IE7 for me.

___________________________________________________________
[small]Do something about world cancer today: PACT[/small]

 

[Pav1977]

No the problem is still there I'm affraid.
Sorry I didn't specify the problem well enough it seems.

If you have a look at the horizontal nav (top) you'll notice that when you hover over it it's not taking all the height of the blue nav. Have a look in FF and then in IE7 you'll see the difference now.
I'm using IE7.0.5730.11 no updates and FF 2.0.0.3.

Please let me know what you think.

 

[Vragabond]

Have you considered using [tt]float: left;[/tt] instead of this hardly supported [tt]display: inline-block;[/tt]? I found it works perfectly in both browsers with floating.

___________________________________________________________
[small]Do something about world cancer today: PACT[/small]

 

[Pav1977]

I'll try it. No I didn't know about that. Could you direct me to some examples of it, but I'm sure I'll find some on w3schools.
In general where do I find info on what is supported and what is not?

Cheers

 

[Pav1977]

Thank you very much this worked! How do I find out about little things like this - what it supported and what is not and how to play little tricks like the float left in this case - what does it exactly do here?

 

[Vragabond]

Huh, I suppose reading articles on sites like A list apart but there is no one stop to get all the information. I personally enjoy the W3C website, because it is information from the source. It just isn't as user-friendly as some of the other sites.

Also, googling for the right keywords will usually get you a bunch of good results from the html gurus' blogs. Not much more I can help you with.

___________________________________________________________
[small]Do something about world cancer today: PACT[/small]