force ie11 to re-render the page after downloading fonts - rendering

I have yet another curious problem with the internet explorer 11.
My application has an embedded font (woff only) used in a button with rounded corners.
When the page first loads in IE11 the button is too small for the text inside. After reloading the page or hover the button it resizes the button correctly.
Now my theory is that IE loads the page and renders it and then loads the font without rendering the page again.
Is there a standard approach to such problems?

Related

How can I force overlay to show when use v-dialog?

I have a v-dialog that opens when page is loaded. Somehow overlay is lost. The behavior is very similar to this bug report: https://github.com/vuetifyjs/vuetify/issues/7798
But in my case overlay works when v-dialog loads after several seconds of page loading, and overlay is lost only when v-dialog is loaded from the very beginning. So I have to find the way to fix it or to force overlay to be shown together with dialog.
I tried to work with v-overlay (to wrap dialog content there), but it's content is not shown as well, if we try to do this while page is loading.
So how can I fix this or force overlay to work?

How do I fix flickering Webview in flyout upon flyout opening?

I have an app that opens a flyout via custom user control. The flyout xaml contains a webview with content given to it via "[webview].NavigateToString()".
When the flyout opens, it does a slight sliding animation from just below the center of the screen to the center of the screen and loads the content (this is the default animation).
The webview content is loaded immediately and when the flyout is finished loading everything, the webview flickers.
I have tried all of the "on load" and "loaded" events to no avail. The flicker always happens after those events.
My only workaround is to set a dispatcher timer to make the webview visible once the flyout is completely finished loading and animating.
Does anyone know how to fix this without the timer?
Note: Upon close inspection on the client machine (surface pro 3), it seems as if the webview is reloading the css style for the webview. I can see the webview with the correct style, then the "flicker" is slow enough that I can see the styling disappearing for a split second then the styling is applied again. I tried removing the styling completely and there is still a flicker. Perhaps it is reloading the entire webview after the flyout is done loading?
Edit: Ok. I have confirmed that it has to do with the default flyout transition. In another area of my app, I use a webview as part of a page. I turned on a transition for that page and the webview did the exact same flicker! Therefore if I can remove the flyout transition completely, the flicker should disappear.
Edit #2: So far I am unable to remove the transitions from the flyout.

how to open nyroModal inside a modal?

The question: I have a Modal with Bootstrap so when I click on it, of course, it opens the page with some info.
On that page, I have a few images. I have tried, when you click the image it will load the image with a black background and (shadowbox style). The thing is that when I tried that it always load the image at the background, not in front and I want to keep the modal opened because you won't be opening the modal 100 times to see the 100 images.
I'm using bootstrap and nyroModal

Text isn't always altered properly in plugin after resize

I wrote an Awesomium 1.7.2 plugin that displays a bunch of text and contains a few buttons. While the plugin functions fine, I have some strange display issues.
I have a separate program that I sometimes "Dock" at the top of my computer screen. When I do that, the text inside my Awesomium window gets warped a little (see screenshots below). That's because that window THINKS that it's maximized, but the screen has been compressed by 20 to 30 pixels; whatever the height of that separate, docked window is.
Other programs seem to be smart enough to render text appropriately when I add/remove my docked program. Also, when I view these web pages directly in a web-browser, they get resized properly after the dock change. It's only when they're inside of this Awesomium control where they don't respond properly to another program being docked. How can I make my html controls behave this way inside of the Awesomium window?
Update: I tried 1.7.3 as well, but the problem still exists.
Update: I also posted this question on answers.awesomium.com and awesomium.zendesk.com, but that hasn't helped.
SCREENSHOTS
Maximized without a docked program present:
Maximized WITH a docked program present and warped, compressed text:

JSP page is loaded half scrolled by default in Safari

I have a web application. It views fine in Firefox and IE. But when I use Safari, there seems to be a problem while loading pages that are long enough to have a vertical scroll bar in them. The page loads and displays the bottom or middle of the page by default. This happens only when Safari is not maximized to full screen.
Has anyone experienced this?
I figured it out. When there is a textfield that is focused, whenever the page loads or refreshes, Safari tries to keep the textfield inside the display area (unlike FF or IE). So my textfield was wayy down and so it scrolled down on every page load.