I was wondering if someone could help me out with this problem. I have a website where I’ve got code like this:
<div id=“container”>
<a name=“top”></a>
<h1 id=“mainpagetitle”><span class=“namesake”>Person’s name </span>College of Something</h1>
</div>
I want to placce the Person’s name on top of the main college name and have the name smaller. So here’s my basic CSS:
#mainpagetitle {
background:#FFF url(images/pagetitle-shadow.gif) no-repeat;
font-family: “Times New Roman”, Times, serif;
font-size: 2.1em;
}
#mainpagetitle span.namesake {
font-size: .5em;
display:block;
clear:right;
}
Ok, not for my problem. In that above scenario, with the “display:block” line for the span, IE won’t display the H1’s background image. With it out, the background image is back, but the text isn’t displayed correctly.This only happens on IE…I’ve only tested IE 6.
Can anyone help? Many thanks in advance.