CODEWITHSUNDEEP
asp.netvb.net
Elatesummer
Elatesummer

Reputation: 313

visual basic asp.net page sometimes renders incorrectly

I have hunted around for this one online but can't find anything like this issue, so if you know of a site please point me in the direction! I have a visual basic asp.net website, written in asp.net 3.5 using visual studio 2010.

I have designed a customised selection of boxes along the top of one page, consisting of a series of image buttons and panels. When you press one image button, the panel for it is shown and all others are hidden, effectively creating a horizontal concertina. Please see below markup (please note there are lists etc in each panel except panelParameters, but as they are not relevant to the issue I have removed them):

        <asp:Panel ID="panelParameters" runat="server" Height="300"
            BorderStyle="Ridge" BorderWidth="5px" Direction="LeftToRight"
            BorderColor="#00539F" Visible="False" CssClass="parameterPanel">
            <asp:Panel ID="PanelArea" runat="server" Visible="true">
            &nbsp;
                <asp:ImageButton ID="imgArea1" runat="server" Height="160px" Width="4%" ImageUrl="~/Images/Panels/Area1Panel.png" CssClass="inlineBlock" />
                <asp:Panel ID="panelArea1" runat="server" Height="160px" Width="71%" CssClass="inlineBlock">
                </asp:Panel>
                <asp:ImageButton ID="imgSection" runat="server" Height="160px" Width="4%" ImageUrl="~/Images/Panels/SectionPanel.png" CssClass="inlineBlock" />
                <asp:Panel ID="panelSection" runat="server" Height="160px" Width="71%"  CssClass="inlineBlock">
                </asp:Panel>
                <asp:ImageButton ID="imgDate" runat="server" Height="160px" Width="4%" ImageUrl="~/Images/Panels/datePanel.png" CssClass="inlineBlock" />
                <asp:Panel ID="panelDate" runat="server" Height="160px" Width="71%" CssClass="inlineBlock">
                </asp:Panel>
                <asp:ImageButton ID="imgResponse" runat="server" Height="160px" Width="4%" ImageUrl="~/Images/Panels/ResponsePanel.png" AutoPostBack="true" CssClass="inlineBlock" />
                <asp:Panel ID="panelResponse" runat="server" Height="160px" Width="71%"  CssClass="inlineBlock">
                </asp:Panel>
                <asp:ImageButton ID="imgArea1Compare" runat="server" Height="160px" Width="4%" ImageUrl="~/Images/Panels/Area1ComparePanel.png" CssClass="inlineBlock" />
                <asp:Panel ID="panelArea1Compare" runat="server" Height="160px" Width="71%"  CssClass="inlineBlock">
                </asp:Panel>
                <asp:ImageButton ID="imgSectionCompare" runat="server" Height="160px" Width="4%" ImageUrl="~/Images/Panels/SectionComparePanel.png" CssClass="inlineBlock" /> 
                <asp:Panel ID="panelSectionCompare" runat="server" Height="160px" Width="71%"  CssClass="inlineBlock">
                </asp:Panel>
            </asp:Panel>
        </asp:Panel>

For the images and the panels, I have used a cssClass which is written in my css as:

.inlineBlock
{
    display:inline-block;
    border:none;
    vertical-align:top;
}

I am using the vb pages to control when the panels are shown and hidden on the 'visible' switch. This works perfectly when the project is run locally on my laptop. I have published the website to an internal web server, and it's fine when I look at it on there. It is also SOMETIMES fine when viewing this on client computers (using the published site on the web server), however on other computers running the same OS image, same version of IE, same resolution and monitor size, for some reason the inline bit isn't working correctly, and the panels appear one below the other instead.

Our internal web developers are stumped on this one so I'm really hoping one of you guys has an idea; if any more code is needed or screen prints of the issue etc I'm happy to provide.

Upvotes: 0

Views: 197

Answers (1)

KennyZ
KennyZ

Reputation: 907

Same version of IE does not mean same mode. Use the F12 key and test in all browser modes. There are serious differences between IE9 mode and IE9 Compatibility View mode.

Upvotes: 1

Related Questions