Site broken in IE and Firefox

HTML & CSS
1

Hey guys,

Was wondering if you could help me debug my banner at http://tinyurl.com/p2le55u

Top Right corner is not lining up with the content area

seems to be the clearfix

How do I remove the clearfix?

2

Looks ok to me unless i’m looking at the wrong thing ? :slight_smile:

3

For me, it doesn’t.

In Chrome, the gap is almost invisible

1144Ă—242 215 KB

But in IE is really big

1248Ă—287 270 KB

4

I’m not seeing a problem in Firefox 33 (and I don’t have IE handy just now to test).

1088Ă—281 243 KB

5

I think i fixed it by changing the img tag from

Max-width 100%

To just

Width 100%

1 Like
6

Well done! Sorry that I couldn’t help more

7

Could you guys please check IE, using a Mac so can’t tell atm

8

Not bad, if I wasn’t looking for it I wouldn’t have noticed.

Looks like IE has a “1px jog” thing happening.

9

Thanks Mittineague,

1px aint too bad, IE sucks balls anyway!

10

Yes it’s the old IE6 1px jog rearing its ugly head again. They never really fixed it they just tried to hide it better but in some situations it reappears.

In your case its the border-radius that triggers the bug.

Simple demo.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
body {
    background:#000;
    padding:50px;
}
.container {
    max-width:960px;
    margin:auto;
    background:#fff;
    border-radius:5px;
    min-height:500px;
}
.header {
    background:#fff;
    height:100px;
}
</style>
</head>

<body>
<div class="container">
        <div class="header"> </div>
</div>
</body>
</html>

Just close the IE11 browser window one pixel at a time as the jog is only evident on every odd width pixel of the browser viewport.

There is no fix even though some suggest using fractions of pixels but this just makes the jog appear on even pixels instead.

The only fix is to remove the border-radius and the bug goes away. Or alternatively use a transparent logo instead of matching the top of the layout exactly.

11

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.