I' m using Microsoft report viewer(11.0.0) 2012 version to display a report and in my aspx page, I use the following code. The problem is the report shows vertical scroll bar when in compatible mode, but it disappears in non-compatibility mode. I tried adding overflow property to external div but that scrolls up the report column headers also when scrolling down. I cannot add compatibility meta tag to fix this. Please help. Thanks
<div style="height:75%;width:95%;">
<rsweb:ReportViewer ID="DailyReportViewer" AsyncRendering="false" SizeToReportContent="false" BackColor="transparent" DocumentMapWidth="40%" DocumentMapCollapsed="true" InternalBorderColor="Transparent" runat="server">
</rsweb:ReportViewer>
</div>
Happened to me as well.
The solution is
<body style="margin: 0px; overflow: auto !important;">
Related
My background image is reloading on every postback. So it causes a flickering everytime you press a button. It occurs in Internet Explorer (Version 11.0.9600.17843 tested) and Chrome (Version 45.0.2454.93 m tested). In Firefox (Version 34.0.5 tested) it works. I have tested no other browsers so far. This is the code for the background image so far:
<style type="text/css">
body
{
background-image: url(/Img/Besuchermanagement_1920_1080.jpg);
background-attachment: inherit;
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
min-height: 925px;
opacity: 0.9
}
</style>
I also added those meta tags when I read about an IE flickering bug:
<meta http-equiv="Page-Enter" content="blendTrans(Duration=0.2)" />
<meta http-equiv="Page-Exit" content="blendTrans(Duration=0.2)" />
But that didn't work for me.
So I added an image and set it invisible through this css
.backgroundImageFix
{
width: 1%;
height: 1%;
opacity: 0.0
}
<asp:Image ID="Image1" runat="server" EnableTheming="True" ImageAlign="Bottom" CssClass="backgroundImageFix"
ImageUrl="~/Img/Besuchermanagement_1920_1080.jpg" />
And now I don't have any flickering issues any more.
But I don't understand why adding an image prevents the background image to reload on a postback. I hope anyone can explain it to me and maybe give me a better solution.
during post back the page reloads because it has a life cycle this makes the page to reload which is the flickering
but to avoid that you can use update panel control in asp.net
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel id="UpdatePanel1" runat="server">
<ContentTemplate>
//your code here
</ContentTemplate>
</asp:UpdatePanel>
this should stop you background image to flicker
You have a couple of options
You should use an update panel - it will only "postback" the required data inside the panel and redraw part of the screen inside the update pannel - take a read of this to see how microsoft ajax can help you. I think you should be using the update panel anyway as it is a better user experience.
Alternatively the issue can also be caused because the background colour of the body is not set. it will then default ot transparent, and the page will be white. you can try setting the background colour to a colour similar to what the image has. I have seen this reduce the flicker on pages in the past.
I want to display a google map in IFrame with scrollbar.
<!DOCTYPE HTML>
<html>
<head>
<title></title>
</head>
<body>
A website
<br />
<iframe src="http://parkall.hu/teszt/parkolok/index.html"
style="overflow: scroll; width: 540px; height: 630px;"></iframe>
</body>
</html>
It works in the latest firefox (v17), but not in Chrome (v23), strangely enough Chrome displays scrollbars for a moment and hides after that. The scrollbar is still useable if you find out to grab an invisible thing....
Have you ever noticed this? Maybe it can be solved with a CSS but i was unable to find out, the scrolling="yes" attribute is not supported in HTML5. And of course if I change scr to wikipedia.org it displays scroll bar.
There is a decent chance that google maps tries to disable the scrollbar from its iframe with javascript. In that case you will need some javascript of your own to counter that a few seconds after pageload (by using setTimeout()).
What you need to change in your setTimeout depends on what is happening that hides the scrollbars. Since the example is not complete, I can't determine what happens exactly.
Please put your code in jsfiddle.net and reply with the link so we can check the exact problem.
I have a website that has a dojo TabContainer. I've been trying to upgrade the dojo library from 1.2 to the later versions.
At 1.5 I've run into a problem.
This is what the TabContainer looks like in FF at 1.5, and what it looked like in the previous versions in all browsers. (IE, Chrome, Safari)
At 1.5, this is what it looks like in IE9
I can't figure out where these arrow buttons are coming from. The styling and markup hasn't changed, I've just swapped out the dojo libraries.
Here is the code:
<asp:Repeater ID="TabRepeater" runat="Server">
<HeaderTemplate>
<div dojoType="dijit.layout.BorderContainer" gutters="false" style="width:600px">
<div dojoType="dijit.layout.TabContainer" style="width:600px; height:350px">
</HeaderTemplate>
<ItemTemplate>
<div dojoType="dijit.layout.ContentPane" style="display:none; height:300px" title="<%#Eval("Name")%>">
<!-- Content -->
</div>
</ItemTemplate>
<FooterTemplate>
</div> <!-- End Tab Container -->
</div> <!-- End Border Container -->
</FooterTemplate>
</asp:Repeater>
It's pretty basic, I've defined the sizes for the containers. I'm not sure why these scroll buttons won't go away. I'm not sure if this is a problem with my code or with the TabContainer since their documentation site doesn't even work in IE9
FF:
IE9:
Any idea what's wrong?
Dojo 1.5 is not officially compatible with IE9. Compatibility has been officially partially supported since dojo 1.6.x and is supposed to be fully compatible with dojo 1.7.x
Also, I do not know much about asp, but this does not look like a good practice
<HeaderTemplate>
<div dojoType="dijit.layout.BorderContainer" gutters="false" style="width:600px">
<div dojoType="dijit.layout.TabContainer" style="width:600px; height:350px">
</HeaderTemplate>
to have a "tag" (except if this tag disappear and is not replaced by any html) enclosing unclosed divs...
I had the same issue using dojo 1.10.4. I was not using asp.net.
I solved this by setting the properties useMenu and useSlider of the TabContainer class:
var container = new TabContainer(
{
style: 'height: 100%; width: 100%;',
useMenu: false,
useSlider: false
}, domConstruct.create('div'))
Thanks to David Walsh.
i got stuck in an issue i.e. i wrote following css for showing page breaks in my html but i am facing the problem that it works fine in the Internet explorer but not working in firefox and chrome below is the inline css i applied
<br style="page-break-after: always;">
below is my HTML code
<asp:Panel ID="pnlHide" runat="server" Visible="false">
<br style="page-break-after: always;">
</asp:Panel>
nb:above line is in asp:panel control of asp.net which renders as DIV in html
any suggestions to change the css are welcome. I will wonder if anybody could plz help me.
If you have any floats, remove them from the css while printing, floats may be the issue and page-break may not be the issue at all.
I have a ModalPopupExtender from the AjaxControlToolkit that is working properly in Firefox, Chrome and IE8, but when I run it in IE8 Compatibility mode, it pops up behind the content of my page, rather than on top.
The popup is in a user control that's rendered by the Masterpage. What I think is happening is it's popping up in front of the master page content, as the Masterpage content (my header and sidebars) is greyed out, but the content placeholders are rendering in front of my popup. I found a solution online that suggested changing your doctype declaration in the master page to:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
But I already had that exact declaration and still have the positioning problem. Here is the popup code:
<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
TargetControlID="lnkbtnDealerID"
PopupControlID="pnlPopup"
BackgroundCssClass="modalBackground"
DropShadow="true"
OkControlID="OkButton"
CancelControlID="CancelButton"
OnOkScript=""
>
</cc1:ModalPopupExtender>
<asp:Panel ID="pnlPopup" runat="server" CssClass="modalPopup" Style="display: none" Width="233px">
<p>Are you sure? Your current shopping cart is valid only for the current Dealer ID. Switching Dealer IDs will reset your cart according to the new Dealer ID chosen.</p>
<br />
<div align="center">
<asp:Button ID="OkButton" runat="server" Text="Ok" />
<asp:Button ID="CancelButton" runat="server" Text="Cancel" />
</div>
</asp:Panel>
And the relevant CSS:
.popupControl {
background-color: white;
position:absolute;
visibility:hidden;
border-style:solid;
border-color: Black;
border-width: 2px;
}
.modalBackground {
background-color:Gray;
filter:alpha(opacity=70);
opacity:0.7;
}
.modalPopup {
background-color:white;
border-width:1px;
border-style:solid;
border-color:Gray;
padding:3px;
width:250px;
}
I just found your posting whilst trying so solve the same problem. For me I tracked it down to a div tag, called mainBody, which all page content is contained within. The CSS class that controls this div has relative positioning but no z-index. As soon as I set the z-index to -1 for mainBody my modalPopup worked perfectly in IE7.
Hope this helps?!
You can only set the Z-index in IE for the parent div you are in.
A div higher up will always render on top of your lower div.
I solved the problem by Always put the Modualwindow Div directly after the tag.
If it's the first div it's always on top.
Henrik
I'd like to add that Z-index is indeed the issue for those running into this in IE 10 compat view, which defaults to IE7 doc mode on a local network.
I used z-index: -1 for the html and body, and then had to go to a z-index: 100 for the other containers. The pop-up classes are at a z-index: 999999; You'll need to adjust for your site.
This might be a solution you can use:
Problem in Z-index of menu and ajax ModalPopupExtender in ASP.net
I have been running into this issue too... but on a prerelease product that we weren't really going to support for IE6/7. But, I just tried it out. Make sure that all of the divs that hold your controls in the modal popup have a really high z-index (like 10001).
If you use the ModalPopupExtender (AjaxToolkit 4.1.50927.0 and .Net 4.0.30319) in an ASP.NET project, you may face the same problem with IE7 and IE8. The Popup window will be completely rendered in IE 9 but not in IE7 & IE8. In that case, try removing the AnimationExtender (fade in) for that ModalPopupExtender it works fine. Check the browser version and render the code for the animation via JS for newer browsers that can handle the fade in effect or do not use the animation if the browser is, say, IE7.