layout doesn't center in internet explorer

#1
Ravenfire

Posted 17 October 2007 - 07:57 PM

Newbie

Members
13 posts

Hey everyone, I'm brand new to css and was wondering if anyone could help me out with this. I've checked the page in Firefox, Safari, Netscape and Internet Explorer and it works great in all except Internet Explorer.

<table class="center">


table.center {

		border: none;

		width: 760px;

		margin-left: auto;

		margin-right: auto;

                text-align: center;

}

with this code the layout is all messed up. If I take out text-align: center, it will just all line up at the left. Does anyone know how I can get this to center in IE?

Here are the links in case anyone wants to look at the full code.

Raven's Avatars
http://angiebowen.co...atars/style.css

#2
Lop

Posted 18 October 2007 - 12:15 PM

Speaks fluent binary

Members
1,172 posts

I think this is just IE 6 flaws in CSS. Try setting the <body> tag to use the center class. This may be what you are looking for.

#3
Ravenfire

Posted 18 October 2007 - 01:20 PM

Newbie

Members
13 posts

I tried that as well and it didn't work (I also upgraded to IE7 and it still doesn't work). If my only problem is that the layout will be left aligned instead of centered in IE, I think I can live with that. Thanks so much for the help!

It's also really strange because sometimes when I refresh the IE page, it does center but on the next refresh it goes back to left.

#4
TcM

Posted 27 October 2007 - 03:27 PM

Writes binary right handed and hex left handed

Members
11,147 posts

I have your same problem.. It would not centralize a table with CSS.. I dont know why. so perhaps it's just an IE bug.. nothing new.

#5
Gabriel

Posted 30 October 2007 - 06:42 AM

Learning Programmer

Members
39 posts

yea I always align tables in the HTML. I"ve never had a problem with IE6 or 7 but I'm a microsoft guy so I know how to tweak it for the most part...

I'm an angel. I kill firstborns while their mamas watch. I turn cities into salt. I even, when I feel like it, rip the souls from little girls, and from now till kingdom come, the only thing you can count on in your existence is never understanding why.
-
Do you know how you got that dent, in your top lip? Way back, before you were born, I told you a secret, then I put my finger there and I said "Shhhhh!"
-
Quotes taken from The Prophecy (1995)

#6
Lop

Posted 31 October 2007 - 11:53 AM

Speaks fluent binary

Members
1,172 posts

You can always just revert back to old school and put the <center> </center> tags around it. This would work in IE as well as FF.

#7
TcM

Posted 31 October 2007 - 04:57 PM

Writes binary right handed and hex left handed

Members
11,147 posts

Well usually I like to use CSS files and not the tags attributes.. because with one slight modification it changes all my pages! Although my business directory has a bunch of useless and extra tags/code.. it really needs a clean up and use CSS more.

#8
Ravenfire

Posted 31 October 2007 - 06:25 PM

Newbie

Members
13 posts

I finally got it to center but now the middle part of the layout is skewed a bit to the left (but still only in IE).

I've been trying to set up an IE specific stylesheet but IE doesn't seem to be recognizing it. Has anyone else ever tried one of these before and gotten it to work?

Here's my code (the site has moved, it's at Raven's Avatars). The styleie file is empty so that I would see right away if it was working or not.

<link rel="stylesheet" type="text/css" href="style.css" />

#9
Ravenfire

Posted 31 October 2007 - 06:49 PM

Newbie

Members
13 posts

Okay, I fixed it. I gave up on the separate stylesheet and ended up solving the problem just by floating my header and footer left like the middle.

Thanks for all the help on this everyone!

#10
Death Slaught

Posted 23 November 2007 - 11:48 AM

Newbie

Members
20 posts

Here's how you do it:

<html>


<head>

<style type="text/css">


.center {

  border:none;

  width:760px;

  position:absolute;

  left:130px;

  top:200px;

  text-align:center;

}


</style>

</head>


<body>

<table class="center">

  <tr>

    <td>text</td>

  </tr>

  <tr>

    <td>text</td>

  </tr>

</table>

</body>


</html>

Hope it helps, Thanks, Death