Home > Software design >  How to make text fill up entire page on mobile browser?
How to make text fill up entire page on mobile browser?

Time:06-20

I have a very simple HTML page that shows bitcoin prices, on mobile it looks terrible because the text is really small and there is a lot of empty space on the right. How can I make this so it fills up the width of the page?

<html>
<head>
<title>HTML in 10 Simple Steps or Less</title>
<meta http-equiv="refresh" content="60" />
</head>
<body>
<script src="https://widgets.coingecko.com/coingecko-coin-list-widget.js"></script>
<coingecko-coin-list-widget coin-ids="ethereum,bitcoin,aave,convex-finance,dopex,dydx" currency="usd" locale="en" width="300""></coingecko-coin-list-widget>
</body>
</html>

Screenshot

https://imgur.com/a/dNG0EKM

CodePudding user response:

The following header tags will prevent the device from scaling automatically and allow you to take control.

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="HandheldFriendly" content="true">

Then, assuming its an iframe, apply this CSS:

iframe{width:100%}
  • Related