IE problem [HTML]

[wsg14]

I'm coding the movieen layout, and I'm done except for this one problem.

FF:
http://www.tehupload.com/uploads/359900853bf8c18ff.png

IE:
http://www.tehupload.com/uploads/92060853bf8c181ie.png

CSS

.content .more_movies {
background-image: url(images/more_movies.png);
width: 312px;
height: 61px;
float: right;
margin-right: 33px;
margin-top: -65px;
}+rep

Moved by Invent (Forum Moderator) from Designing & Development: Please post in the correct forum next time, thanks :).

[Tom-743]

It will have something to do with the margin-right. IE does;

width (400px) + margin (10px) + padding (20px) = width of 460px.

But firefox does;
margin (10px) + padding (20px) = 60px
width (400px) - padding+margin (60px) = width for content 340px


More info http://www.habboxforum.com/showthread.php?t=478012

[wsg14]

Any way I could fix the problem?

[Jahova]

Isn't their a way doing;
if IE [CODE HERE]
if FF [CODE HERE]

In php or javascript?

[redtom]

Isn't their a way doing;
if IE [CODE HERE]
if FF [CODE HERE]

In php or javascript?

You can do it in the CSS, I've forgot it what it is but if you define the margin twice but on one do what you want for IE and the other what you want for FF then in the FF one you add some character and it confuses the browser so it uses the other definition for the margin. Well it's something like that, google something along them lines

[Calon]

Isn't their a way doing;
if IE [CODE HERE]
if FF [CODE HERE]

In php or javascript?


<script type="text/javascript">
function detectBrowser()
{
var browser=navigator.appName;
var b_version=navigator.appVersion;
var version=parseFloat(b_version);
if ((browser=="Netscape"||browser=="Microsoft Internet Explorer")
&& (version>=4))
{
alert("Your browser is good enough!");
}
else
{
alert("It's time to upgrade your browser!");
}
}
</script>

(http://www.w3schools.com/js/js_browser.asp)

[Fehm]

Try using a php IF function e.g.

<?php
if (browser "Netscape")
echo? [width=10%]
?>

Off the top of my head ^^ soz.

[wsg14]

Thanks Tom and Tom, I'll be using that. +rep to all for your help though.

EDIT: I tried to use the following:


<!--[if IE]>
.content .more_movies {
background-image: url(images/about.png);
width: 312px;
height: 61px;
float: right;
margin-right: 33px;
margin-top: -65px;
}
<![endif] -->

So I use the image "about.png" just to see if it would work, unfortunately it doesn't. Anybody know why that won't work?

[Source]

Make sure thats in the HTML and below the other .content .more_movies.

If its in a style sheet use that if method to include a special IE style sheet.

[wsg14]

Make sure thats in the HTML and below the other .content .more_movies.

If its in a style sheet use that if method to include a special IE style sheet.

Can I use it to just specify one div? Instead of a whole stylesheet? (like what I posted.

[Source]

<!--[if IE]>
<style type="text/css">
.content .more_movies {
background-image: url(images/about.png);
width: 312px;
height: 61px;
float: right;
margin-right: 33px;
margin-top: -65px;
}
</style>
<![endif] -->

Put that just before your div or in the head after the included stylesheet.

[wsg14]

<!--[if IE]>
<style type="text/css">
.content .more_movies {
background-image: url(images/about.png);
width: 312px;
height: 61px;
float: right;
margin-right: 33px;
margin-top: -65px;
}
</style>
<![endif] -->Put that just before your div or in the head after the included stylesheet.

Thanks a lot.