I have a small <div> element which contains two text blocks - one within
<h5> tags and the other within <p> tags.
I don't want any extra line spacing between elements so use the
display:inline property.
This works for IE6 but Opera7.54 and Netscape7.1 add large line spacing
between the text blocks and any lines of wrapped text.
The line spacing is independant of the font size and is consistent between
all lines.
ie: it's not larger between the <h5> and <p> lines than it is between the
wrapped <p> lines.
Because I'm trying to stick to W3C standards I used the doctype property.
As soon as the doctype is removed then the large line spacing disappears.
I ran the HTML code through the W3C validator and it validated without
errors.
Is it a rendering bug which IE6 doesn't suffer from (!!!) or am I missing
something?
Code sample is listed below.
The web page from which is was extracted will work fine without any doctype
declaration but I'd rather fix the problem properly.
*************************
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Test Page</title>
<style type="text/css">
<!--
..infoBody{font-size:10px; display:inline}
..infoHead{font-size:12px; display:inline}
..infoFrame{position:absolute; top:50px; left:50px; width:90px; height:100px;
background:cyan; text-align:center}
// -->
</style>
</head>
<body>
<div class="infoFrame">
<h5 class="infoHead">The Heading</h5>
<p class="infoBody"><br>This is some text which is spaced too large.</p>
</div>
</body>
</html>