This is a migrated thread and some comments may be shown as answers.

IE11 breaking pageview width/height

3 Answers 86 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
dino
Top achievements
Rank 1
dino asked on 06 Dec 2013, 08:12 PM
The pageview control is not working properly on my site when viewed in IE11.  The attached screenshots demonstrate the problem.  I've tried all manner of changes including eliminating cssclass on the pageview.  The code is very straightforward....

<asp:Content ID="Content2" ContentPlaceHolderID="cph_content" Runat="Server">
 
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
    </telerik:RadScriptManager>
     
    <telerik:RadSkinManager ID="RadSkinManager1" Runat="server" Skin="Web20">
    </telerik:RadSkinManager>
    <div>
        <div style="float:right;text-align:right;position:relative;top:16px;right:16px;z-index:5;width:60px;"><asp:LinkButton ID="linkbuttonLogOff" runat="server">LOG OFF</asp:LinkButton></div>
 
        <telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1">
        <Tabs>
            <telerik:RadTab Text="IRIS Home" Selected="True" SelectedIndex="0" PostBack="false">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Account Access" SelectedIndex="1" PostBack="false" ToolTip="Shareholder account information and details">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Reports" SelectedIndex="2" PostBack="false" ToolTip="Real-time reports">
                    </telerik:RadTab>
                    <telerik:RadTab Text="SM@RT" SelectedIndex="3" PostBack="false" ToolTip="Stock Issuance/DWAC">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Archived Reports" ToolTip="Transfer Journals, Check Registers, ACH Reports, DRP List" SelectedIndex="4" PostBack="false">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Issue Stats" ToolTip="Issuer Share and Account Statistics" SelectedIndex="5" PostBack="false" Visible="false">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Annual Meeting Center" ToolTip="Tools and Info to Manage Your Shareholder Meetings" SelectedIndex="6" PostBack="false" Visible="false">
                    </telerik:RadTab>
        </Tabs>
        </telerik:RadTabStrip>
 
        <telerik:RadMultiPage ID="RadMultiPage1" runat="server">
            <telerik:RadPageView ID="pageviewWELCOME" runat="server" Selected="true" contenturl="welcome.aspx" Height="900" Width="980">
            </telerik:RadPageView>
 
            <telerik:RadPageView ID="pageviewIRIS" runat="server" CssClass="pageview" ContentUrl="" Height="900" Width="980">
            </telerik:RadPageView>
 
            <telerik:RadPageView ID="pageviewREPORTS" runat="server" height="900" ContentUrl="reports.aspx" Width="980">
            </telerik:RadPageView>
 
            <telerik:RadPageView ID="pageviewSMART" runat="server" CssClass="pageview" ContentUrl="" Height="900" Width="980">
            <h4>SM@RT</h4>
            </telerik:RadPageView>
 
            <telerik:RadPageView ID="pageviewAlchemy" runat="server" CssClass="pageview" Height="540" Width="980">
            </telerik:RadPageView>
 
          <telerik:RadPageView ID="pageviewIssueStats" runat="server" CssClass="pageview" ContentUrl="issuestats.aspx" Height="760"  Width="980">
            </telerik:RadPageView>
          
          <telerik:RadPageView ID="pageviewAnnualMeetingCenter" runat="server" CssClass="pageview" Height="1300" BackColor="White" ContentUrl="annualmeetingcenter" Width="980">
            </telerik:RadPageView>
 
        </telerik:RadMultiPage>
         
    </div>
</asp:Content>

I added width attributes to the pageviews and nothing changed.  I modified the cssclass "pageview" and nothing changed.
I eliminated the cssclass and nothing changed. I tried adding the width attribute to the multipage control and nothing changed.

Any ideas?

The pageview style is also pretty simple:
.pageview
{
    padding:0px;
    background-color:#FFFFFF;
    height:100%;
    width:980px;
    margin:0px;
}

3 Answers, 1 is accepted

Sort by
0
dino
Top achievements
Rank 1
answered on 06 Dec 2013, 09:09 PM
If I add:

.pageview iframe
{
width: 980px;
}

...it fixes the width problem.  The height is different for each pageview though (and really should be dynamic but I couldn't ever seem to get that to work).
0
dino
Top achievements
Rank 1
answered on 09 Dec 2013, 08:55 PM
I'm still looking for some acknowledgement of my original post. Is no one else experiencing this problem?
0
Nencho
Telerik team
answered on 11 Dec 2013, 02:05 PM
Hello Dean,

Please refer to this documentation article, demonstrating how to set height to 100% when using ContentUrl in PageView.

Regards,
Nencho
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Tags
TabStrip
Asked by
dino
Top achievements
Rank 1
Answers by
dino
Top achievements
Rank 1
Nencho
Telerik team
Share this question
or