!Hi
Today I was hit by a bug that makes it impossible to set a WebDialog’s background color.
After a few investigations, it seems that there is a problem with the CSS priority rules when a WebDialog is build.
Fortunately, CSS provides a way to overrule this priority order. And, fortunately again, theres is a way in Xojo to take advantage of this overruling.
First of all, create a WebStyle that will be used only for your dialog.
Name it as you like. Let’s say ‘myWebStyle’ for this example.
Set the ‘Style’ property of the WebDialog in the WebPage layout editor.
In the App’s inspector, set the ‘HTMLHeader’ property with:
<style>
.myWebstyle {
background-color: rgb(0,0,0) !important;
}
</style>
Replace ‘myWebstyle’ by the name of your webstyle ( CSS is case sensitive ! ) and adjust the rgb() value as you like. You can also use the #RRGGBB CSS Color syntax instead of rgb().
I attached a demo project to the feedback report about this case ( <https://xojo.com/issue/15800> ).
If you want to know more about the !important CSS declaration, its purpose and its drawbacks or why you shouldn’t use it ;), read this in English, and here in French.