Reputation: 21
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
Reputation: 5135
You can use
background-size: cover;
This will make your image fit the entire container. Also, remove width=100%
;
Upvotes: 1