nieselfriem
Mitglied
Ich habe unten stehendes Design mit im IE6 angeschaut. Dort wird es offenbar wegen des Expanding-Box Problems nicht richtig dar gestellt. Ich habe es versucht mittel
oder
in der Klasse Sidebar zu fixen. Das klapp aber nicht wie ich mir das vorstellte. Was kann ich da machen?
das Css:
Ich hoffe das lange Listing schreckt nicht ab. Gruß niesel
Code:
overflow:hidden
Code:
word-wrap:break-word
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de">
<head>
<title>
</title>
<link rel="stylesheet" type="text/css" href="css/basic.css" media="screen"/>
<!--[if IE]>
<style type="text/css">
body {overflow: hidden;}
</style>
<![endif]-->
</head>
<body>
<div id="wrap">
<div id="header">
</div>
<div id="sidebar">
<div id="sidebarpic">
</div>
<div id="sidebarlist">
<ul id="navigation">
<li>
<a href="index.html" title="Zurück zur Hauptseite" class="sidemenu">Start</a>
</li>
<li >
<a href="anmeldung.html" title="Zur laufseite" class="sidemenu">Anmeldung</a>
</li>
<li >
<a href="agb.html" title="Zur den AGBs" class="sidemenu">AGBs</a>
</li>
</ul>
</div>
<div id="sidebarcolor">
</div>
</div>
<div id="content">
<div id="centerpic">
</div>
<div id="centertext">
<div>
<h1>Joggen ohne Ende</h1>
<p>
Tetempus, magna et pellentesque condimentum, neque mi ultrices turpis, quis varius enim urna at metus. Nulla.
</p>
</div>
</div>
</div>
<div id="footer">
<ul>
<li><a href="index.html" class="footermenu">Home</a></li>
<li><a href="impressum.html" class="footermenu">Impressum</a></li>
<li><a href="kontakt.html" class="footermenu">Kontakt</a></li>
</ul>
</div>
</div><!--End Wrap -->
<!-- Insert HTML here -->
</body>
</html>
das Css:
Code:
body {
font-size: 85%;
font-family: 'Trebuchet MS', Verdana, Arial, Sans-Serif;
text-align: center;
background-image:url("hin1.jpg");
}
#wrap {
width: 900px;
margin: 0 auto;
text-align: left;
border-left: 1px solid #999;
text-align:left;
}
#header {
float: left;
width: 900px;
height: 50px;
text-align:right;
/* border: 1px solid #999;
border-top: 1px solid #999;*/
#footer {
float: left;
width: 900px;
height: 22px;
text-align:left;
font-size: 8pt;
margin:0px;
padding-left: 150px;
background:#2f4f4e;
}
#content {
float: left;
height: 460px;
width: 745px;
}
#sidebar {
float: left;
height: 460px;
width: 150px;
text-align:left;
/*border-left: 1px solid #999;*/
padding: 0px;
word-wrap: break-word;
overflow:hidden;
}
#centerpic {
width:742px;
height:210px;
/* border: 5px solid lightgrey;*/
border-left: 5px solid lightgrey;
border-right: 5px solid lightgrey;
border-top: 5px solid lightgrey;
background-image:url("header.jpg");
border-bottom: 3px solid #2f4f4e;
}
#centertext {
width:745px;
height:232px;
background: white;
padding:1px;
overflow:auto;
border-bottom: 5px solid lightgrey;
border-left: 5px solid lightgrey;
}
#sidebarpic {
width: 150px;
height: 45px;
/*background: blue;*/
background-image:url("joggenlogo2.jpg");
/*border-bottom: 5px solid lightgrey;*/
}
#sidebarlist{
width: 148px;
height: 171px;
background: white;
padding:1px;
/*border-bottom: 5px solid lightgrey;*/
word-wrap: break-word;
}
#sidebarcolor{
width: 150px;
height: 25px;
background: #2f4f4e;
/*border-bottom: 5px solid lightgrey;*/
text-align: left;
padding-left: -36px;
}
#navigation {
list-style-type: none;
text-align: right;
margin-left: -50px;
}
h1, h2, h3, h4, h5, h6 {
margin: 20px;
}
h1 {
text-align:center;
}
p {
margin: 15px 20px;
}
#footer ul {
list-style-type: none;
margin:0px;
padding: 0px;
}
#footer ul li {
display: inline;
}
a.sidemenu:link, a.sidemenu:visited {
color: #666666;
text-decoration: none;
/*background-color:grey;*/
width:144px;
display: block;
padding:2px;
margin-bottom:5px;
text-align: right;
}
a.sidemenu:hover, a.sidemenu:active, a.sidemenu:focus {
color: lightblue;
text-decoration: none;
}
a.footermenu:link, a.footermenu:visited {
color: white;
text-decoration: none;
}
a.footermenu:hover, a.footermenu:active, a.footermenu:focus {
color: lightblue;
text-decoration: none;
}
Ich hoffe das lange Listing schreckt nicht ab. Gruß niesel