Question

I have a h3 and an h1 tag:

<div id="header">
    <div class="title">
        <img class="logo" src="images/logo.png" />
        <h3>Title1</h3>
        <h1><a href="#">Title2</a></h1>
    </div><!-- end .title -->
</div><!-- end #header -->

#header {
 background: transparent url(images/header_bg.png) top center no-repeat;
 margin: 30px auto 0;
 width: 960px;
 height: 240px;
}
#header .title { float: right }
#header h1,
#header h2,
#header h3 {
 text-align: right;
 border: none;
 padding: 0;
}

In IE7, the h3 aligns right like it's supposed to, but the h1 doesn't. WHY?

Was it helpful?

Solution

Specify an explicit width for .title div - You should use the IE developer tools (press F12) to solve these kind of problems.

Also check out this similar question

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top