Faccoun
Faccoun

Reputation: 21

How do you set a background image to position itself dynamically in a mobile browser in landscape mode

I want a background image to position itself dynamically when a mobile browser is in landscape mode;

This is the code that I wrote to attempt this:

<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=0">
<body style="margin:0; background-image: url(example.jpg); background-repeat: no-repeat; width:100%;"></body>
</head>
</html>

It doesn't seem to work. Does anyone have any suggestions?

Upvotes: 1

Views: 19

Answers (1)

Florin Pop
Florin Pop

Reputation: 5135

You can use

background-size: cover;

This will make your image fit the entire container. Also, remove width=100%;

Upvotes: 1

Related Questions