Home/ Questions/Q 7798295
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-01T23:57:53+00:00

I have coded a html page as follows: <html> <head> <meta http-equiv=Content-Type content=text/html; charset=UTF-8

  • 0

I have coded a html page as follows:

 <html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 <title>Test</title>
 </head>
 <body bgcolor="#f2f2f2">

     <div style="width:1000px;height:auto;margin:0px auto;" ><!-- main container -->
         <div style="width:1000px;height:50px;margin:0px auto; background-color:pink;" ><!-- container 2 -->
           Hello world
          </div> <!-- end container 2 -->
     </div> <!-- end main container -->

 </body>
</html>

The width of the div is 1000px and it is center aligned using the property margin:0px auto;
When I view this in the desktop browser, it is fine. But in a mobile browser(iPhone Safari), I get an unwanted horizontal scroll, also the entire page floats hrizontally and diagonally.

Why does this happen?

How can I fix this issue which is specific to iPhone/iPad browser. I have not tested in other mobiles.

What are the code I need to put in to make a mobile browser display a webpage(designed for desktop browser) properly?

Please suggest.

Thanks

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Thank you for the suggestions provided.

    A slight modification solved the issue.

    <meta name="viewport" content="width=1000" />

    This worked.

    • 0