IE7 fine, IE6 doesnt show 1

[adamroof]

Odd situation where only SOME text doesnt display. If the IE6 user were to highlight the area, the text then shows up, only when highlighted.

any ideas where i went wrong here? its a mix and match external css and inline styles, is that an issue?

the class projectName doesnt display at all on IE6. The objective seems to show, but not leader and category and they are asp labels outside of the spans.

this is an internal site, so i dont know how to run css validator against this. Again, it looks perfect in 7.

<div id="divProjectHeaderView" runat="server">
    <div style="float: right; text-align: right;">
        <span class="tdRight75B">Create Date:</span>
        <asp:Label ID="lblProjectDate" runat="server"></asp:Label>
        <br />
        <span class="tdRight75B">Last Update:</span>
        <asp:Label ID="lblProjectLastUpdate" runat="server"></asp:Label>
        <br />
        <asp:LinkButton ID="lbEditProject" runat="server" Text="Edit Project" OnClick="Edit_Project"></asp:LinkButton>
    </div>
    <div class="projectName">
        <asp:Label ID="lblProjectName" runat="server"></asp:Label>
    </div>
    <span class="tdRight100B">Project Leader:</span><asp:Label ID="lblProjectLeader"
        runat="server"></asp:Label>
    <br />
    <span class="tdRight100B">Category:</span><asp:Label ID="lblProjectCat" runat="server"></asp:Label>
    <br />
    <span class="tdRight100B" style="float: left;">Objective:</span>
    <div style="float: left; margin-bottom: 10px;">
        <asp:Label ID="lblProjectObjective" runat="server"></asp:Label>
    </div>
</div>

#divProjectHeaderView
{
    font-size: 9pt;
    font-family: Arial;
}
.projectName
{
    font-size: 12pt;
    color: Navy;
}
.tdRight100B
{
    display: inline-block;
    width: 100px;
    text-align: right;
    font-weight: bolder;
    padding-right: 3px;
    vertical-align: top;
}

thanks for any input

 

[traingamer]

What does the actual html look like?

 

[adamroof]

um? im confused? between the div tags above?

 

[traingamer]

That's not html. That's ASP. What is served up to the browser after the ASP server processes that code?

Greg
"Personally, I am always ready to learn, although I do not always like being taught." - Winston Churchill

 

[adamroof]

sry
ime, if someone asked for html, id post as above.

what the html renders is below

<div id="divProjectHeaderView">
                        <div style="float: right; text-align: right;">
                            <span class="tdRight75B">Create Date:</span>
                            <span id="lblProjectDate">1/12/2007</span>
                            <br />
                            <span class="tdRight75B">Last Update:</span>
                            <span id="lblProjectLastUpdate">1/12/2007</span>
                            <br />
                            <a id="lbEditProject" href="javascript:__doPostBack('lbEditProject','')">Edit Project</a>
                        </div>
                        <div class="projectName">
                            <span id="lblProjectName">Test New Project</span>
                        </div>
                        <span class="tdRight100B">Project Leader:</span><span id="lblProjectLeader">Adam Roof</span>
                        <br />
                        <span class="tdRight100B">Category:</span><span id="lblProjectDept">Administration</span>
                        <br />
                        <span class="tdRight100B" style="float: left;">Objective:</span>
                        <div style="float: left; margin-bottom: 10px;">
                            <span id="lblProjectObjective">this and that
<br>
<br>then this</span>
                        </div>

 

[adamroof]

oops.... my clipboard didnt update

<div id="divProjectHeaderView">
                        <div style="float: right; text-align: right;">
                            <span class="tdRight75B">Create Date:</span>
                            <span id="lblProjectDate">1/12/2007</span>
                            <br />
                            <span class="tdRight75B">Last Update:</span>
                            <span id="lblProjectLastUpdate">1/12/2007</span>
                            <br />
                            <a id="lbEditProject" href="javascript:__doPostBack('lbEditProject','')">Edit Project</a>
                        </div>
                        <div class="projectName">
                            <span id="lblProjectName">Test New Project</span>
                        </div>
                        <span class="tdRight100B">Project Leader:</span><span id="lblProjectLeader">Adam Roof</span>
                        <br />
                        <span class="tdRight100B">Category:</span><span id="lblProjectDept">Administration</span>
                        <br />
                        <span class="tdRight100B" style="float: left;">Objective:</span>
                        <div style="float: left; margin-bottom: 10px;">
                            <span id="lblProjectObjective">this and that
<br>
<br>then this</span>
                        </div>

 

[Vragabond]

I don't think IE6 supports the [tt]inline-block;[/tt] property of the display. Also, sometimes IE6 has a bunch of problems rendering certain text for no reason and adding [tt]position: relative;[/tt] to the container helps.

 

[adamroof]

hmmm relatives huh? i like my relatives...
it worked!

#divProjectHeaderView
{
    font-size: 9pt;
    font-family: Arial;
    position: relative;
}

should i just make the body tag use relatives? or all divs that arent absolute?

 

[Vragabond]

All elements, unless stated otherwise have a position: static; That is almost identical to relative, with the exception of:
- relatively positioned elements serve as boundaries for any absolutely positioned children elements;
- relatively positioned elements can be shifted from their original position via top/bottom/left/right;
- relatively positioned elements sometimes cause IE6 to behave and sometimes IE7 to misbehave.