1.

Solve : Can't get centering to work in all browsers?

Answer»

I'm trying to make a website, but there's a BIT of a problem.



In Internet Explorer, the navbar and main content get centered like I want them to be, but in Chrome & Firefox they stick to the left. Apparently there is a CSS attribute somewhere that Chrome and Firefox won't READ like Internet Explorer. Anyone know what attribute I need to change so the centering will be universally recognized?

Thanks.Are you hand coding the HTML?
Or are you using a generator? Like maybe Dreamweaver.Can you post your CSS code here?Or a URL to the site?I'm using Dreamweaver CS3.

Code: [Select]charset "utf-8";
.headerLinks {
background-repeat: no-repeat;
background-position: center center;
height: 50px;
width: 100%;
font-family: Candara, Corbel, "Monotype Corsiva", Verdana;
font-size: 20px;
line-height: 45px;
text-align: center;
}
.CONTAINER {
text-align: center;
font-family: Candara, Corbel, "Monotype Corsiva", Verdana;
background-position: center center;
vertical-align: middle;
}
.mainContHome {
background-image: url(Images/border_bg_home_maincont.png);
background-repeat: no-repeat;
background-position: center center;
height: 360px;
width: 1000px;
text-align: center;
}
.mainContHomeText {
width: 850px;
height: 236px;
margin-top: 53px;
}
.mainContGuidesMinigames {
background-image: url(Images/border_bg_guides_minigames.png);
background-repeat: no-repeat;
background-position: center center;
height: 500px;
width: 1000px;
text-align: center;
}
.mainContQuestsBorder {
background-image: url(Images/border_bg_quests_table.png);
background-repeat: no-repeat;
height: 4400px;
width: 1000px;
background-position: center center;
text-align: center;
}
.monstersubmission {
background-image: url(Images/border_bg_monstersub.png);
background-repeat: no-repeat;
height: 800px;
width: 1000px;
}
Here are videos for Dreamweaver tutorials.
Videos of dreamweaver cs3 tutorialsI THINK you'll find this helpful: http://www.maxdesign.com.au/articles/center/You're missing:

Code: [Select]margin-left: AUTO;
margin-right: auto;
Works in more places than text-align: center which is, well, for aligning text.Ah, thanks Rob! That fixed it.Cool.



Discussion

No Comment Found