BillyRayPreachersSon
Programmer
I've run into an issue with Netscape 7.0 not playing ball when using "display:block" for inline elements. I initially thought it was some of my other styling (including floats, etc), but after cutting my CSS down to the bare minimum, I still have the problem.
Here's my test harness:
All I'm trying to achieve is to have the labelSuffix span on a new line.
While the test harness shows a labelPrefix, the actual markup looks like this:
The label CSS can't be modified just for this situation, as I have no way of knowing (in the CSS) if the label has a labelSuffix within it, or not (unless, of course, it doesn't change the appearance of other labels - then I'm all ears!).
I cannot change the span to a div, as it must be able to sit inside inline elements and still validate. While I could potentially use a <br />, I'd rather do this with CSS if possible.
I had initially thought that giving the label a display of block would cure the problem, but it does not. If I remove the label element, all works as expected, so it is clearly a problem with the way Netscape handles block-displayed elements inside inline elements (regardless of whether they have been styled to be block or not).
Has anyone come across this problem before, or know of any potential solutions?
Thanks!
Dan
[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
Here's my test harness:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "[URL unfurl="true"]http://www.w3.org/TR/html4/loose.dtd">[/URL]
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="description" content="Netscape test harness">
<title>Netscape test harness</title>
<style type="text/css">
span.labelPrefix {
display: block;
background-color: red;
}
span.labelSuffix {
display: block;
background-color: gold;
}
</style>
</head>
<body>
<div>
<label>
<span class="labelPrefix">Date of birth</span>
<span class="labelSuffix">(DD, MM, YYYY)</span>
</label>
</div>
</body>
</html>All I'm trying to achieve is to have the labelSuffix span on a new line.
While the test harness shows a labelPrefix, the actual markup looks like this:
Code:
<label>
Date of birth
<span class="labelSuffix">(DD, MM, YYYY)</span>
</label>The label CSS can't be modified just for this situation, as I have no way of knowing (in the CSS) if the label has a labelSuffix within it, or not (unless, of course, it doesn't change the appearance of other labels - then I'm all ears!).
I cannot change the span to a div, as it must be able to sit inside inline elements and still validate. While I could potentially use a <br />, I'd rather do this with CSS if possible.
I had initially thought that giving the label a display of block would cure the problem, but it does not. If I remove the label element, all works as expected, so it is clearly a problem with the way Netscape handles block-displayed elements inside inline elements (regardless of whether they have been styled to be block or not).
Has anyone come across this problem before, or know of any potential solutions?
Thanks!
Dan
[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
![[banghead]](/data/assets/smilies/banghead.gif "[banghead] [banghead]")
![[smile]](/data/assets/smilies/smile.gif "[smile] [smile]")