Farhad Mammadli
Farhad Mammadli

Reputation: 469

Need to make html page responsive

Need to make theresponsive layout. I added meta viewpor, but still no luck. Or zoom it out according to screen dimensions to disable usage of horizontal scrollbar.

<html>
<head>

<meta name="viewport" content="width=device-width, initial-scale=1.0"/>

</head>
<body>

<div class='myIframe'>
<iframe height="800" frameborder="0" scrolling="no" width="466" src="EXAMPLE_WEBSITE"></iframe>

</div>

</body>
</html>

Upvotes: 0

Views: 60

Answers (1)

Jonathan Musso
Jonathan Musso

Reputation: 1374

You will need to utilize breakpoints through CSS Media Queries. Please read through Mozilla's documentation.

Example:

@media (min-width: 700px) { ... }

This tells the browser to render the styles for the page when the minimum width of the viewport is met, which would be 700px.

You should be building with a mobile first approach. Your first stylesheet should reflect this. You will then gradually build up to greater displays.

Remember to use Relative units with Responsive Web Design.

Upvotes: 2

Related Questions