Sidebar falsche position von 4udesigns, 16.08.2008 20:56

Sidebar falsche position

4udesigns 16.08.2008 20:56
Danke für die Antwort.
So sieht jetzt mein Quelltext aus, aber jetzt ist alles durcheinander..
<html>  
<head>  
<title>Discreated -  
<?php  
$site = "Impressum";  
echo $site;  
?>  
</title>  
<style type="text/css">  
body {background-color: #dddddd;background-image:url();}  
  
a{color:#000000; font-size: 15px; text-decoration: none;}  
  
a:hover {color: #666666; font-size: 15px; text-decoration: none;}  
  
a:link {color: #333333; font-size: 15px; text-decoration: none;}  
  
a:active {color: #555555; font-size: 15px; text-decoration: none;}  
  
a:visited {color: #444444; font-size: 15px; text-decoration: none;}  
  
#Design {  
width:800px;  
margin-left:100px;  
}  
  
#Header_oben {  
margin-top: 40px;  
height: 200px;  
width: 800px;  
background-color: #ffffff;  
background-image:url(http://83.246.96.56/090816/oW6bmao2.png);  
color: #EBB000;  
border: 0px solid #888888;  
padding: 0px;  
}  
  
#nav_container {  
margin-top: -60px;  
width: 800px;  
height: 52px;  
background-color: #xxx;  
color: #000000;  
border: 0px solid #888888;  
padding: 0px 0px 0px 0px;  
background-image: url();  
}  
  
#Textfeld {  
width: 610px;  
background-color: #xxx;  
color: #222222;  
background-image: url(http://img134.imageshack.us/img134/4895/tfvm4.png);  
border: 0px solid #888888;  
margin-bottom: 0px;  
padding: 10px 10px 0px 10px;  
display: inline;  
float: left;  
}  
  
#Textfeldup {  
width: 620px;  
height: 30px;  
background-color: #xxx;  
color: #222222;  
background-image: url(http://img291.imageshack.us/img291/1643/tfokp9.png);  
border: 0px solid #888888;  
margin-bottom: 0px;  
margin-top: 15px;  
padding: 5px 0px 0px 10px;  
display: inline;  
float: left;  
}  
  
#Textfelddown {  
width: 610px;  
height: 30px;  
background-color: #xxx;  
color: #222222;  
background-image: url(http://img364.imageshack.us/img364/8388/tfuge9.png);  
border: 0px solid #888888;  
margin-bottom: 15px;  
padding: 0px 10px 0px 10px;  
display: inline;  
float: left;  
}  
  
#sidebar_container {  
width: 145px;  
background-color: #ffffff;  
color: #222222;  
border: 0px solid #888888;  
margin-bottom: 0px;  
padding: 0px 5px 0px 5px;  
float:right;  
background-image: url(http://img364.imageshack.us/img364/8566/sliv0.png);  
}  
  
#sidebarup {  
width: 145px;  
height: 8px;  
background-color: #ffffff;  
color: #222222;  
border: 0px solid #888888;  
margin-top: 0px;  
padding: 0px 5px 0px 5px;  
float:right;  
background-image: url(http://img99.imageshack.us/img99/9661/slohe0.png);  
}  
  
#sidebardown {  
width: 145px;  
height: 8px;  
background-color: #ffffff;  
color: #222222;  
border: 0px solid #888888;  
margin-bottom: 15px;  
padding: 0px 5px 0px 5px;  
float:right;  
background-image: url(http://img364.imageshack.us/img364/6916/sluhd9.png);  
}  
  
#Feld_unten {  
width: 780px;  
height: 25px;  
background-color: #ffffff;  
color: #222222;  
clear: both;  
border: 0px solid #888888;  
padding: 5px 10px 0px 10px;  
background-image: url(http://img217.imageshack.us/img217/7218/bottomtb2.png);  
}  
</style>  
</head>  
<body>  
  
<div id="Design">  
<div id="Header_oben"></div>  
<style type="text/css" media="screen">  
<!--  
  
/* Allgemeine Einstellungen */  
body  
{  
font-family: Verdana, sans-serif;  
font-size: 14px;  
overflow: auto;  
padding: 10px;  
margin: 0px;  
}  
  
/* Dieser Teil ist dafür, die Menüpunkte ohne Listenpunkt darzustellen */  
ul, li  
{  
list-style-type: none;  
padding: 0px;  
margin: 0px;  
}  
  
/* Hier stellt Ihr ein, wie weit die Schrift vom Menürand entfernt ist. */  
li a  
{  
padding-right: 20px;padding-top: 5px;padding-left: 10px;  
}  
  
/* Hier wird das ganze Menü positioniert */  
div.menu  
{  
position: absolute;  
z-index: 3;  
top: 210px;  
left: 55%;  
margin-left:-405px;  
width:905px;  
}  
  
/* Dieser Punkt bestimmt die Menübreite */  
.menu li  
{  
width: 160px;  
float: left;  
}  
  
/* Hier bestimmt Ihr das Aussehen der Menülinks */  
.menu a  
{  
border: 0px solid #000000;  
background-color: #xxx;  
background-image: url(http://img217.imageshack.us/img217/8064/cmbuf2.png);  
text-decoration: none;  
text-align: center;  
font-weight: bold;  
cursor: pointer;  
margin: 0px;  
display: block;  
height: 23px;  
color: #00CCFF;  
}  
  
/* Hier bestimmt Ihr das Aussehen der Hintergründe der Menülinks, wenn Ihr mit der Maus drüber fahrt */  
.menu a:hover  
{  
background-color: #XXX;  
background-image: url(http://img201.imageshack.us/img201/8972/cmbh2ui6.png);  
}  
  
/* Hier bestimmt Ihr die Größe der Menülinks (Für weitere Menüs, müssen die Punkte entsprechend erweitert werden) */  
#smenu1, #smenu2, #smenu3, #smenu4, #smenu5  
{  
font-size: 8px;  
display: none;  
width: 160px;  
float: left;  
}  
  
/* Hier bestimmt Ihr die Farbe der Menülinks (Für weitere Menüs, müssen die Punkte entsprechend erweitert werden) */  
#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a  
{  
font-weight: bold;  
padding-top: 5px;  
border-top: 0px;  
cursor: pointer;  
color: #FFFFFF;  
}  
//-->  
  
</style>  
  
<!-- Anfang des Scriptes -->  
  
<script type="text/javascript">  
<!--  
function montre(id)  
{  
with (document)  
{  
if (getElementById)  
getElementById(id).style.display = 'block';  
else if (all)  
all[id].style.display = 'block';  
else  
layers[id].display = 'block';  
}  
}  
  
function cache(id)  
{  
with (document)  
{  
if (getElementById)  
getElementById(id).style.display = 'none';  
else if (all)  
all[id].style.display = 'none';  
else  
layers[id].display = 'none';  
}  
}  
//-->  
</script>  
  
<!-- Ende des Scriptes -->  
  
<div class="menu">  
  
<li><a href="javascript:void(0);" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">Community</a>  
<ul id="smenu4" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">  
<li><a href="http://discreated.de/forum.php">Forum</a></li>  
<li><a href="http://discreated.de/login.php">Einloggen</a></li>  
<li><a href="http://discreated.de/register.php">Registrieren</a></li>  
  
</ul>  
</li>  
  
<li><a href="javascript:void(0);" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">HomepageHilfe</a>  
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">  
<li><a href="http://discreated.de/gfx.php">Grafix</a></li>  
<li><a href="http://discreated.de/designs.php">Layouts/Designs</a></li>  
<li><a href="http://discreated.de/hp-tools">Tools</a></li>  
  
</ul>  
</li>  
  
  
<li><a href="javascript:void(0);" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">Tutorials</a>  
<ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">  
<li><a href="http://discreated.de/tutorials/photoshop.php">Photoshop</a></li>  
<li><a href="http://discreated.de/tutorials/aftereffects.php">After Effects</a></li>  
<li><a href="http://discreated.de/tutorials/cinema4d.php">Cinema4d</a></li>  
<li><a href="http://discreated.de/tutorials/gimp.php">Gimp</a></li>  
  
</ul>  
</li>  
  
  
<li><a href="javascript:void(0);" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">Showroom</a>  
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">  
<li><a href="http://discreated.de/showroom/toode.php">2d</a></li>  
<li><a href="http://discreated.de/showroom/threede.php">3d</a></li>  
<li><a href="http://discreated.de/showroom/vdo.php">Video</a></li>  
  
</ul>  
</li>  
  
<!-- Hier können weitere Menüs eingefügt werden, einfach den oberen Teil kopieren und anpassen  
'smenu1' muss dann entsprechend hochgezählt werden (4x)  
  
<li><a href="javascript:void(0);" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">HomepageHilfe</a>  
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">  
<li><a href="http://Menupunkt1.1.htm">Menupunkt1.1</a></li>  
<li><a href="http://Menupunkt1.2.htm">Menupunkt1.2</a></li>  
<li><a href="http://Menupunktx.x.htm">Menupunkt1.2</a></li>  
  
</ul>  
</li>  
  
-->  
  
</div>  
<div id="nav_container"></div>  
<div id="mitte">  
<div id="mitte_links>  
<div id="Textfeldup"><table width="610" height="25" border="0" background="http://83.246.96.56/090816/FsX9F2S.png" align="">  
    <tbody>  
        <tr>  
            <td align="right"><b><font face="arial" color="#ffffff">  
<?php  
echo $site;  
?>  
</font></b></td>  
        </tr>  
    </tbody>  
</table></div>  
<div id="Textfeld">Seiteninhaber</div>  
<div id="Textfelddown"></div>  
</div>  
<div id="mitte rechts">  
<div id="sidebarup"></div>  
<div id="sidebar_container">its too late lorem ipsum dolor ametits too late lorem ipsum dolor am</div>  
<div id="sidebardown"></div>  
</div>  
</div>  
<div id="Feld_unten"><table border="0" align="center">  
    <tbody>  
        <tr>  
            <td>&nbsp;</td>  
            <td align="center"><a href="http://discreated.de/aboutme.php" target="_self">&Uuml;ber Mich</a> | <a href="http://discreated.de/impress.php" target="_self">Impressum</a> | <a href="http://discreated.de/contact.php" target="_self">Kontakt</a> | <a href="http://discreated.de/partners.php">Partner</a></td>  
            <td>&nbsp;</td>  
        </tr>  
    </tbody>  
</table></div>  
</div><!-- // ENDE #Design -->  
  
</body>  
</html>
Beitrag melden
– Informationen zu den Bewertungsregeln
SELFHTML Forum - Ergänzung zur Dokumentation Übersicht

4udesigns: Sidebar falsche position

Beitrag lesen

Sidebar falsche position

Sidebar falsche position
