Developer forum

Forum » Rapido » Rapido website in IE11

Rapido website in IE11

Axel Marijt
Axel Marijt
Reply

Hi there,

We created a new website in Rapido, but when we show it in IE11 it's completely broken. How can we fix this, because we expect that a lot of clients from are still browsing from an older computer and/or are using Internet Explorer.

See the multiple screenshots attached.

Grt. Axel


Replies

 
Karsten Thuen Dynamicweb Employee
Karsten Thuen
Reply

Hi Axel

We have fixed this recently, and if it is not in the latest hot fix for Rapido, it will surely come in the next. I am having a little trouble remembering what the fix was, do you have a url? Then I may be able to tell you what is needed.

 

Best regards
Karsten Thuen

 
Axel Marijt
Axel Marijt
Reply

Hi Karsten,

Yes we have, the URL is: https://holland-controls.com/

We have more Rapido sites with comparable problems, like http://partell2.azurewebsites.net/.

 

Grt. Axel

 

 

 
Karsten Thuen Dynamicweb Employee
Karsten Thuen
Reply

Hi Axel

Perfect, thanks. I think the bug is related to IE being quite bad at some very comon css properties. There is an easy fix though, that as far as I remember, solves the bug everywhere on Rapido. You have two options:

 

Make the fix in the Rapido base css:

In css/base/layout/_layout.less replace the current "height" classes with:

.paragraph-container--height-sm {
    height: 150px;

    & > .paragraph-container {
        height: 150px;
    }
}

.paragraph-container--height-md {
    height: 220px;

    & > .paragraph-container {
        height: 220px;
    }
}

.paragraph-container--height-lg {
    height: 350px;

    & > .paragraph-container {
        height: 350px;
    }
}

.paragraph-container--height-xl {
    height: 550px;

    & > .paragraph-container {
        height: 550px;
    }
}

The other option is to do it in Ignite:
If you want to stay away from the base css, then create the fix in your own ignite project (css/ignite/layout/_layout.less)

 

The bug on http://partell2.azurewebsites.net/ is a little different, and I am quite sure it is fixed on newer versions of Rapido. The fix for your solution would be to create this css in css/ignite/layout/_layout.less 


.logo.dw-mod img {
    height: 60px;
}

 

Best regards
Karsten Thuen

 
Axel Marijt
Axel Marijt
Reply

Hi Karsten,

As far as I can see the solutions don't make any difference... 

Are these problems fixed in newer versions of DW or Rapido? Perhaps an update will do the job...

 

Greetings, Axel

 
Karsten Thuen Dynamicweb Employee
Karsten Thuen
Reply

Hi Axel

They should be fixed on newer solutions. And defintely in the comming hotfix. But I am really sure the CSS fixes work on your sites. It is the same as on our recent sites, and I have tested them on your sites using the browser inspector. But I can not see that you have added the new css changes are on your sites?

If you only need these changes to the CSS, and do not have any setup for them in, for example, Visual Studio (No access to Less compiling), then a very quick and fine way to add the CSS is to put it directly in ignite.min.css

 

Best regards
Karsten Thuen

 
Axel Marijt
Axel Marijt
Reply

Hi Karsten,

It seems it works! On my collegues pc the site shows better in IE 11.

Only the references page ( https://holland-controls.com/holland-controls/references ) where we use the cases item type is still displayed wrong. The boxed for the cases are to wide for the screen.

In the cases template i've temporarily deleted the links for the detailed pages, because these aren't ready yet. But I didn't change any styles in them.

Hope there is also a fix for this problem.

 

Greetings.

 
Axel Marijt
Axel Marijt
Reply

Hi,

On most IE 11 browsers the site is showing fine now (except for the issue explained above), but in the browser of 1 collegue it shows horrible. See the attachment. 

 

 

 
Nicolai Pedersen
Reply

We will buy him a new computer then!

 
Karsten Thuen Dynamicweb Employee
Karsten Thuen
Reply

Hi Axel

A very common and classic reason for something that is different on an apparently identical computer, is very often that the browser cache is not properly cleaned. You can try to investigate that.

Regarding the ( https://holland-controls.com/holland-controls/references )  thing. It is due to that IE not always understands the css class "grid__col-auto" we need it to be "grid__col-12" in this case. Does it help if you put the ItemPublisher app on the paragraph item type of name "Paragraph". Right now it is on a standard DW paragraph, and that should not be used.

 

Best regards
Karsten Thuen

 

You must be logged in to post in the forum