Help with Auto Margin on Safari and IE

thestrokes · #1 (**permalink**) 07-09-2009, 10:55 PM

Greetings,

I used auto-margin to center my website on Firefox, but now it doesn't even appear on Safari or Internet Explorer, please help!

CSS:

Code:

body {
	
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}


#wrapper {
	margin: auto;
	width: 700px;
	position: relative;
	
}

HTML

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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<SCRIPT TYPE="text/javascript">
<link rel="stylesheet" href="1251.css" type="text/css" charset="utf-8" />
	

<!--
function popup(mylink, windowname)
{
if (! window.focus)return true;
var href;
if (typeof(mylink) == 'string')
   href=mylink;
else
   href=mylink.href;
window.open(href, windowname, 'width=550,height=485,scrollbars=yes');
return false;
}
//-->


<title>The Premiere Men's Magazine for Designer Fashions and Modern Music | 12:51</title>
<META name="description" content="12:51 Magazine: With its content of extensive fashion coverage, vibrant photography and engaging artist interviews, 12:51 appeals to a demographic of influential men whose refined personal style reflects their taste in music.">
<META name="keywords" content="12:51,12:51 Magazine,1251Mag.com,men's fashion magazine,designer,upscale,music,indie rock,rock,celebrity fashion,celebrity style,new york fashion">


<br><br><br><br><br>

<style type="text/css"><!--

a.effect1:link {color: black; text-decoration: none; }
a.effect1:active {color: black; text-decoration: none; }
a.effect1:visited {color: #555555; text-decoration: none; }
a.effect1:hover {color: white; text-decoration: none; background: #000000}


a.effect2:link {color: #000088; text-decoration: none; }
a.effect2:active {color: #000088; text-decoration: none; }
a.effect2:visited {color: #555555; text-decoration: none; }
a.effect2:hover {color: white; text-decoration: none; background: #000000}

-->



</style>


</head>

<body>

<div id="wrapper">
	
	
	
	
					<table width="381" border="0"align="left"  cellspacing="5">
  <tr>
    
    
<th width="369" scope="col"><img src="magazine.jpeg" width="353" height="493" /></th>
  </tr>

</table>

<table width="319" height="505" border="0" align="right" cellspacing="5">


  <tr>
    <th width="97" height="117" scope="col"><img src="delete3.jpg" width="295" height="115" /></th>
  </tr>
  <tr>
    <th height="236" align="left" valign="top" scope="row"><font face = arial><font size=2>
<b>- <A HREF="http://www.1251mag.com/mediakit.pdf" class="effect2">CURRENT ISSUE</b></a><br>
<b>- <A HREF="http://www.1251mag.com/mediakit.pdf" class="effect1">PAST ISSUES</b></a><br>
<b>- <A HREF="http://www.1251mag.com/mediakit.pdf" class="effect1">ABOUT</b></a><br>
<b>- <A HREF="http://www.1251mag.com/mediakit.pdf" class="effect1">PHOTOS</b></a></th>
  </tr>
  <tr>
    <th  height="127" valign="bottom" scope="row"><font face = arial><font size=1>I<A  HREF="http://www.1251mag.com/public_html/survey/index.php?sid=68218&lang=en" onClick="return popup(this, 'notes')" class="effect1"> CONNECT </a> I<A  HREF="http://www.1251mag.com/new1251.html" onClick="return popup(this, 'notes')" class="effect1"> CONTACT </a>I<A  HREF="http://www.1251mag.com/NEWlegal.html" onClick="return popup(this, 'notes')" class="effect1"> LEGAL </a>I<A  HREF="http://www.1251mag.com/public_html/survey/index.php?sid=45382&lang=en" onClick="return popup(this, 'notes')" class="effect1"> ADVERTISE </A>I <br><FONT COLOR="#555555">COPYRIGHT &copy; 2009 12:51. ALL RIGHTS RESERVED.</font></th>
  </tr>
</table>



  </tr>
</table>


		
		
		
	</div>
	


</body>
</html>

curtiss · #2 (**permalink**) 07-11-2009, 10:40 AM

A few issues that may be affecting your site:
1) You never closed your "script" tag. Also, you have a link to your style sheet inside of your javascript. That's the wrong place for that.
2) You are commenting out the closing tag of your HTML comment inside of your javascript. I don't think that would have an effect, but it's possible. In fact, these days, there is no real reason to use HTML comments inside of your javascript or CSS, as only about one-tenth of one percent (if that many) of users still use browsers that were effected by that.
3) You have four br tags inside of the head of your document. Those will mess up the way some browsers render your page.

I would recommend trying to fix those issues, then run the page through the W3C validator to see what other issues pop up. Then, use the information it provides to try to get your page working properly. Good luck.