Centering my website...

vrufusx65v

vrufusx65v

New Member
Messages
74
Reaction score
0
Points
0
i have a website whose width is 1280px wide and trying to look at it from a 1024x768 res PC i was wondering if i was able to (upon loading the website) center itself, or even better just get rid of the bottom scroll bar...

here's the code i have for the container the website is all in:

Code: 
.container {
	margin: 0 auto;
	position:static;
	width:1280px;
	height:2060px;
	background: #2a2a2a;
}
 
Last edited:
essellar

essellar

Community Advocate
Community Support
Messages
3,295
Reaction score
227
Points
63
No -- if you've set the width to 1280px, then the container div will always be at 1280px wide, so on any screen less than about 1310px wide there will be a horizontal scroll bar. (Don't forget that browsers have "chrome", like the vertical scroll bar and application window borders that take up some screen space as well.) If 1280px is the widest you want the page to go, then set 1280px as the max-width instead of the width.
 
B

bunny.invasion76

New Member
Messages
12
Reaction score
0
Points
0
If you want to center it it must be like this:
Code: 
.container {
	margin-left: auto;
	margin-right: auto;
	position:static;
	width:1280px;
	height:2060px;
	background: #2a2a2a;
}

But if you use Internet Explorer be sure you have the next on top of your HTMLscript ;D
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Greets Magdy,
 
essellar

essellar

Community Advocate
Community Support
Messages
3,295
Reaction score
227
Points
63
bunny.invasion76 said:
If you want to center it it must be like this:...
Click to expand...

Wrong. The CSS in the original posting, margin: 0 auto;, is a short form for this:
Code: 
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
The order of attributes for the short form is Top, Right, Bottom, Left (remember TRouBLe as a mnemonic). There is absolutely no need to set the doctype to XHTML, since HTML 4.01 in standards mode (that is, with a full doctype declaration) and HTML 5 accomplish the same thing (and XHTML is a dead technology; XML dialects are great data transport containers, but they are lousy document markup languages for a number of reasons, not least of which is that they are sibling-order-agnostic). Finally, if you set a width for the page that is wider than the viewport, there will be a horizontal scroll bar -- and that was the original problem.
 
B

bunny.invasion76

New Member
Messages
12
Reaction score
0
Points
0
:D I always use the long code

PS: In Internet Explorer 8 it wont work when you don't put the doctype :O (On my pc) ;D

---------- Post added at 10:24 AM ---------- Previous post was at 10:23 AM ----------
essellar said:
Wrong. The CSS in the original posting, margin: 0 auto;, is a short form for this:
Code: 
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
The order of attributes for the short form is Top, Right, Bottom, Left (remember TRouBLe as a mnemonic). There is absolutely no need to set the doctype to XHTML, since HTML 4.01 in standards mode (that is, with a full doctype declaration) and HTML 5 accomplish the same thing (and XHTML is a dead technology; XML dialects are great data transport containers, but they are lousy document markup languages for a number of reasons, not least of which is that they are sibling-order-agnostic). Finally, if you set a width for the page that is wider than the viewport, there will be a horizontal scroll bar -- and that was the original problem.
Click to expand...

OW, ok sorry, you're right ;D
My mistake :p
 
You must log in or register to reply here.
Top