I'm just beginning with ASP.NET using Visual Web Developer 2010 Express. I'm currently following
this Walkthrough on MSDN. Everything is going fairly ok except that when I run the page it aligns to the left of my screen. Is there anyway to align it to the center
of the screen?
I'm assuming you mean you want all of your content left-justified, but you want the content contained in a block that is centered and moves when the page resizes?
Contain all of the content you want centered, and apply the following css to it:
<div id="containerDiv" style="width:960px; margin:auto;">
<!-- all of your centered content goes here-->
</div>
the css could also be in an external .css file (an approach I prefer)
"Dream as if you'll live forever, live as if you'll die today." --James Dean
- Make sure when you set your zoom to 50% it should be in the center. Always should stay in center. ( if it goes to top left corner then something wrong)
Thank you guys. I'm a complete newbie in web development/CSS. If I'm not asking for too much, could you please tell me where to put the codes or if/how I can achieve this using the Toolbar? So grateful.
I've applied your codes. It justified the entire contented but still not what I want.
I'm using a 17" screen. When I run the code the entire page shifts to the left of the screen leaving a dispproprotiate white/open space on the right of the screen. I want the left and right margins to be the same ie equal empty/white space to the left and
right, just like the current forums.asp.net page I'm working on is on the center of my screen.
Sylva Okolie...
Member
13 Points
33 Posts
How to Center a Web Page
Dec 21, 2012 05:53 PM|LINK
I'm just beginning with ASP.NET using Visual Web Developer 2010 Express. I'm currently following this Walkthrough on MSDN. Everything is going fairly ok except that when I run the page it aligns to the left of my screen. Is there anyway to align it to the center of the screen?
Thanks.
Bobby-Z
Contributor
2838 Points
1120 Posts
Re: How to Center a Web Page
Dec 21, 2012 05:57 PM|LINK
best way is to use CSS, have one main div that holdes all content and style it like this
div.main {width:1024px; margin:0px auto} the margin:0px auto will make it center, then add all other content inside.
Currently Learning: ASP, SQL, CSS, JavaScript, AJAX, XML, XSLT, C# So please be patient with me! Thanks
AceCorban
Star
12358 Points
2274 Posts
Re: How to Center a Web Page
Dec 21, 2012 05:58 PM|LINK
margin:auto
I'm assuming you mean you want all of your content left-justified, but you want the content contained in a block that is centered and moves when the page resizes?
Contain all of the content you want centered, and apply the following css to it:
<div id="containerDiv" style="width:960px; margin:auto;"> <!-- all of your centered content goes here--> </div>the css could also be in an external .css file (an approach I prefer)
Boracay
Member
142 Points
165 Posts
Re: How to Center a Web Page
Dec 21, 2012 07:52 PM|LINK
This is what i did:
- Make sure when you set your zoom to 50% it should be in the center. Always should stay in center. ( if it goes to top left corner then something wrong)
Here is my CSS
body, html
{
background: url ("...");
height: 90%;
}
#Container
{
margin-top:1px;
margin-right:auto;
margin-left:auto;
margin-bottom:0px;
width: 980px;
}
}
Have Fun !!
Sylva Okolie...
Member
13 Points
33 Posts
Re: How to Center a Web Page
Dec 21, 2012 08:42 PM|LINK
Boracay
Member
142 Points
165 Posts
Re: How to Center a Web Page
Dec 22, 2012 04:05 AM|LINK
Hello,
Can you go through this video tutorial ? if you need more help let me know.
this video will guide you for starting,
http://www.asp.net/web-forms/videos/building-35-applications/css
Thanks
KiaranNafade
Member
134 Points
58 Posts
Re: How to Center a Web Page
Dec 22, 2012 06:22 AM|LINK
Sylva Okolie...
Member
13 Points
33 Posts
Re: How to Center a Web Page
Dec 22, 2012 01:26 PM|LINK
@Bobby/Ace,
I've applied your codes. It justified the entire contented but still not what I want.
I'm using a 17" screen. When I run the code the entire page shifts to the left of the screen leaving a dispproprotiate white/open space on the right of the screen. I want the left and right margins to be the same ie equal empty/white space to the left and right, just like the current forums.asp.net page I'm working on is on the center of my screen.
Thanks.
Sylva Okolie...
Member
13 Points
33 Posts
Re: How to Center a Web Page
Dec 22, 2012 02:15 PM|LINK
Thanks guys, I've done it by referencing the sytle to the form instead of the division
#form1 { width: ???px; margin: 0px auto; } <HTML> <HEAD> <BODY> <FORM id="form1" runnat="server"> <DIV> //Page contents here </DIV> </FORM> </BODY> </HEAD> </HTML>