Alex Cane
Alex Cane

Reputation: 167

HTML Auto margin

Alright here it goes.

Normally I'm doing alright in HTML, but for this specific problem, I can't help it to ask for some help..

I've been looking around, but I cant find anything to solve it (worst is that it worked like 1 day ago, and I cant remember what changes I made)

http://beta.deaglegame.net

In Firefox, it is centered properly (Well 3.6 that I am using) But when I try with chrome, safari, and some versions of IE, it aligns to the left.

So if you could look at my source and maybe let me know what could cause this, I would be really greatful!

http://beta.deaglegame.net/css/style.css

Here is my html and container elements styles.

html, body {
background-image: url(../images/background.png);
background-repeat: repeat-x;
background-attachment: fixed;
font-family: Tahoma, Geneva, sans-serif;
font-size: 11px;
margin: 0;
color: #282949;}

#all {
width: 920px;
margin:auto;
position:relative;
height:auto;
overflow:hidden;}

Thanks to anyone! This might seem simple, but eh, I can't solve it.

Upvotes: 0

Views: 1086

Answers (2)

Michael
Michael

Reputation: 1231

Looks like something might be wrong with your float or widths. Did you try removing some of the floats, you can cancle floats in your css by placing a container arround your floating element and giving it a overflow: hidden.

Greetz.

Upvotes: 0

Oscar Godson
Oscar Godson

Reputation: 32716

Multiple issues.

You don't have #all set in your HTML. Change your #mainContent you have there to #all and it'll center (just tried and it worked). However, I suggest changing that to a class since you can only use IDs once and you have multiple elements you need centered like that table (which i'd suggest removing and replacing with semantic code) You need to center your header table with #all and #mainContent.

Hope this helps!

Upvotes: 1

Related Questions