maui: MAUI WebView is not displaying body background-image

Description

I have a HTML wich has a background image but on Android it is not appearing, only a white background.

<WebView Source="https://maui20220216.azurewebsites.net/test.html" />

I tried this same code on Xamarin and it correctly displays the background image.

The HTML page on the Source is like this:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<base href="~/" />
	<link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
	<link href="css/site.css" rel="stylesheet" />
	<link href="CartaoDescontoBlazorApp.styles.css" rel="stylesheet" />
	<component type="typeof(HeadOutlet)" render-mode="ServerPrerendered" />

	<!-- Chrome, Firefox OS and Opera -->
	<meta name="theme-color" content="#185177">
	<!-- Windows Phone -->
	<meta name="msapplication-navbutton-color" content="#185177">
	<!-- iOS Safari -->
	<meta name="apple-mobile-web-app-status-bar-style" content="#185177">
</head>
<body style="min-width:100vw; min-height:100vh;background-image:url('https://way2tutorial.com/images/img_nat.png') !important; background-attachment:fixed; background-position:center bottom; background-size: cover;">

</body>
</html>

Steps to Reproduce

Create a page with this

 <html><body style="min-width:100vw; min-height:100vh;background-image:url('https://way2tutorial.com/images/img_nat.png') !important; background-attachment:fixed; background-position:center bottom; background-size: cover;"></body></html>

Publish this page

Create a new .NET MAUI Insert this code in MainPage.xaml

<WebView Source="https://maui20220216.azurewebsites.net/test.html" />

Then notice that the background image is not being displayed on the Mobile App on Android.

If you visit the URL on a Desktop, you can see the background image: https://maui20220216.azurewebsites.net/test.html

Examples:

MAUI:

Xamarin Forms:

Version with bug

Preview 13 (current)

Last version that worked well

Unknown/Other

Affected platforms

Android

Affected platform versions

Android 11

Did you find any workaround?

No

Relevant log output

No response

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Reactions: 1
  • Comments: 22 (4 by maintainers)

Most upvoted comments

I have the same bug in my Maui App