Wednesday, March 23, 2011

Center middle the content of a DIV based web page

When browsing we found a lot of website midle centered. The question is how developer doing this. In forums i found many times this question. Its simple and easy to middle the content for div based design. To do that wrap up all div in one div and then apply some CSS to middle or center the web page.
I want to make the below example:











To do that add an aspx page in your project. Then add the below stylesheet/CSS under head HTML tag:
<style type="text/css">
        #main_container {width: 760px;margin:auto}
        #content
            {
                background-color:gray;
                font-weight:bold;
                color:White;
            }
    </style>

Now write the below code under BODY tag:
<form id="form1" runat="server">
        <div id="main_container">
            <div id="content">
                Main Body Here
            </div>
        </div>    
    </form>

Now run the page. Hope you found your content in middle or center of the browser.

1 comments:

Infiniti Air Conditioner Compressor said...

This is my Good luck that I found your post which is according to my search and topic, I think you are a great blogger, thanks for helping me out from my problem..

Want to say something?
I WOULD BE DELIGHTED TO HEAR FROM YOU

Want To Search More?
Google Search on Internet
Subscribe RSS Subscribe RSS
Article Categories
  • Asp.net
  • Gridview
  • Javascript
  • AJAX
  • Sql server
  • XML
  • CSS
  • Free Web Site Templates
  • Free Desktop Wallpapers
  • TopOfBlogs
     
    Free ASP.NET articles,C#.NET,VB.NET tutorials and Examples,Ajax,SQL Server,Javascript,Jquery,XML,GridView Articles and code examples -- by Shawpnendu Bikash