csshtmlalignmentcenter

How to align a <div> to the middle (horizontally/width) of the page

I have a div tag with width set to 800 pixels. When the browser width is greater than 800 pixels, it shouldn't stretch the div, but it should bring it to the middle of the page.

Solution 

  •     <body>
        <div style="width:800px; margin:0 auto; background-color:red;margin-bottom: 50px;">
            Centered Content
        </div>
        <div style="text-align:center; width:400px; margin:0 auto; background-color:red; color:white; padding: 5px;">
            Centered Content (width reduced for illustrative purposes in SO)
        </div>
    </body>