Woran liegt es, dass der IE8 meine Website partout nicht zentriert?
Bisher habe ich vieles probiert
(left:50% im Wrapper
text-aligne:center im body
text-aligne:center im wrapper
display:inline; im wrapper
Meine Indexseite funktioniert einwandfrei, aber die about-Seite klebt am rechten Seitenrand im IE8, obwohl ich den gleichen Ausangscode genommen habe.
HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta name="generator" content="HTML Tidy for Linux (vers 6 November 2007), see www.w3.org">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="content-type" content="text/css">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<meta http-equiv="X-UA-Compatible" content="IE=8">
<link rel="stylesheet" href="css_style2.css" type="text/css">
<!--[if lt IE 8]>
<link rel="stylesheet" type="text/css" href="css_IE2.css" />
<![endif]-->
<style type="text/css">
/*<![CDATA[*/
type="text/css">
/*]]>*/
</style>
<title> about</title>
</head>
<body>
<div id="wrapper">
<div id="wrapper_backimg"><img src="images/style2_img.jpg" alt="Grafik" border="none"></div>
<div id="wrapper_logo"><img src="images/logo.gif" border="none" alt="logo"></div>
<div id="wrapper_whitespace"></div>
<div id="wrapper_mm">
<a id="wrapper_mm_home" href="index.html" name="wrapper_mm_home"></a>
<a id="wrapper_mm_folio" href="portfolio.html" name="wrapper_mm_folio"></a>
<a id="wrapper_mm_about" href="about.html" name="wrapper_mm_about"><img src="images/about2.gif" alt="about" border="none"></a>
<a id="wrapper_mm_contact" href="contact.html" name="wrapper_mm_contact"></a>
<div id="wrapper_mm_spacer"></div>
</div>
<div id="wrapper_mm_right"></div>
<div id="wrapper_content"><a id="wrapper_content_leist" href="aboutservice.html" name="wrapper_content_leist"></a> <a id="wrapper_content_moi" href="aboutme.html" name="wrapper_content_moi"></a></div>
<div id="wrapper_footer"><a id="wrapper_footer_fmleft" name="wrapper_footer_fmleft"></a> <a id="wrapper_footer_fm_middle" name="wrapper_footer_fm_middle"></a> <a id="wrapper_footer_links" href="links.html" name="wrapper_footer_links">Links</a> <a id="wrapper_footer_imprint" href="imprint.html" name="wrapper_footer_imprint">Imprint</a></div>
</div>
</body>
</html>
CSS (Datei css_IE2):
/*----------CSS Style----------*/
#wrapper {display:inline; position:absolute; width:895px; height:660px; top:0px;}
#wrapper_backimg {
display:inline; width:895px; height:63px; top:0px}
#wrapper_logo {
display:inline; width:850px; height:55px; padding-left:20px; top:324px}
#wrapper_whitespace {
display:inline; width:895px; height:100px; margin-top:379px; margin-left:40px;
background:white; font-family:Arial,Helvetica,sans-serif; font-size:14px;
line-height:18px; font-weight:normal; color:#00A4E0; text-align:left;
}
/*----------MENU BEREICH----------*/
#wrapper_mm {
display:inline; width:120px; height:100px; top:475px; margin-left:20px;
}
#wrapper_mm a.home:link {
display:inline; background:url("images/home1.gif"); width:120px; height:20px; padding-left:30px;
}
#wrapper_mm a.home:hover {
display:inline; background: url("images/home2.gif"); width:120px; height:20px; padding-left:30px;
}
#wrapper_mm a.folio:link {
display:inline; background: url("images/folio1.gif"); width:120px; height:20px; padding-left:30px; margin-top:20px;
}
#wrapper_mm a.folio:hover {
display:inline; background: url("images/folio2.gif");
width:120px; height:20px; margin-top:20px;
}
#wrapper_mm a.about:link {
display:inline; background: url("images/about1.gif"); width:120px; height:20px; padding-left:30px; margin-top:40px;
}
#wrapper_mm a.about:hover {
display:inline; background: url("images/about2.gif"); width:120px; height:20px; padding-left:30px; margin-top:40px;
}
#wwrapper_mm a.contact {
display:inline; background: url("images/contact1.gif"); width:120px; height:20px; padding-left:30px; margin-top:60px;
}
#wrapper_mm a.contact:hover {
display:inline; background: url("images/contact2.gif"); width:120px; height:20px; padding-left:30px; margin-top:60px;
}
#wrapper_mm_spacer {
position:absolute; width:120px; height:20px; top:603px; background:white;
float:left}
#wrapper_mm_right {width:755px; height:100px; background:white; float:left}
#wrapper_content {
display:inline; width:895px; height:55px; top:565px; background:black; float:left;}
#wrapper_content_leist a.leist {
display:inline; width:102px; height:25px; margin-left:18px; background: url("images/leist1.gif");
}
#wrapper_content_leist a.leist:hover {
display:inline; margin-left:18px; width:102px; height:25px; background: url("images/leist2.gif");
}
#wrapper_content_moi a.moi {
display:inline; margin-top:25px; margin-left:18px;
background: url("images/moi1.gif"); width:102px; height:25px;
}
#wrapper_content_moi a.moi:hover {
display:inline; margin-top:25px; margin-left:18px;
background: url("images/moi2.gif"); width:102px; height:25px;
}
/*----------FUSSBEREICH----------*/
#wrapper>wrapper_footer {
display:block; width:895px; height:30px; margin-top:620px; background-color:black; float:left; }
#wrapper_footer_fmleft {width:30px; height:30px; background-color:black;}
#wrapper_footer_fm1 {display:inline; width:130px; height:12px; background-color:black; font-family:Arial,Helvetica,sans-serif; font-size:11px; line-height:normal; font-weight:normal; font-color:#00A4E0; margin-top:9px; margin-left:30px;}
#wrapper_footer_news {display:inline; width:100px; height:30px; background:black; float:left; font-family:Arial,Helvetica,sans-serif;
font-size:11px; line-height:29px; font-weight:normal; color:#00A4E0;
text-decoration:none; text-align:center; margin-top:0px; margin-left:170px;}
#wrapper_footer_news:hover {display:inline; width:100px; height:30px; background:white; float:left; font-family:Arial,Helvetica,sans-serif; font-size:11px; line-height:29px; font-weight:normal; color:#00A4E0;
text-decoration:none; text-align:center; margin-top:0px; margin-left:170px;
}
#wrapper_footer_fm_middle {display:inline; width:400px; height:30px; background-color:black; margin-left:230px; }
#wrapper_footer_links {display:inline; width:40px; height:30px;
margin-top:0px; background:black; font-family:Arial,Helvetica,sans-serif;
font-size:11px; text-decoration:none; line-height:29px; font-weight:normal; color:#00A4E0; text-align:center; right:65px;}
#wrapper_footer_links:hover {display:inline; width:40px; height:30px;
margin-top:0px; background:white; font-family:Arial,Helvetica,sans-serif;
font-size:11px; text-decoration:none; line-height:29px; font-weight:normal;
color:#00A4E0; text-align:center; right:65px;}
#wrapper_footer_imprint {display:inline; width:40px; height:30px;
margin-top:0px; background:black; font-family:Arial,Helvetica,sans-serif;
font-size:11px; text-decoration:none; line-height:29px; font-weight:normal;
color:#00A4E0; text-align:center; right:25px;}
#wrapper_footer_imprint:hover {display:inline; width:40px; height:30px;
margin-top:0px; background:white; font-family:Arial,Helvetica,sans-serif;
font-size:11px; text-decoration:none; line-height:29px; font-weight:normal;
color:#00A4E0; text-align:center; right:25px;}