alles verstellt, bitte helfen :(

Windassel

Hi,

Hi, ich habe ein Problem,
ich wollte, dass der head, die navigation und das bild dadrunter, sich, in der breite, über die ganze hp erstreckt, die textarea dadrunter aber immer noch mittig ausgerichtet ist, sich aber NICHT über die ganze hp erstreckt, sondern nur eine breite von ca. 850px hat. Ich wollte mal wissen, was ich eingeben muss, damit das auch so im browser erscheint. Krieg´s irgendwie nicht hin -.- Und ein Problem hab ich noch. Die Sidebar, soll direkt neben der textarea erscheinen. Ich wollte mal wissen, ob man das nicht einstellen kann, dass die sich automatisch daran anpasst? Die ist momentan bei mir, unterhalb von der textarea. Ich hoffe, dass Ihr mir helfen könnt.

Mein .css code

* {
font-family: Verdana, Geneva, sans-serif;
font-size: 13px;
margin: 0px;
padding: 0px;
}
#wrapperarea {
background-color: #999;
width: 1000px;
margin-right: auto;
margin-left: auto;
}
#wrapperarea #logo {
background-color: #FFFFFF;
height: 100px;
margin: 0px;
}
a image {
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
margin-right: auto;
margin-left: auto;
}
#wrapperarea #navigation {
height: 30px;
background-color: #999;
margin: 0px;
}
#wrapperarea #header {
background-color: #FFF;
background-image: url(../Images/header.jpg);
background-repeat: no-repeat;
height: 165px;
}

Mein QUellcode:

<!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" />
<title>guhte Website?</title>
<style type="text/css">
body,td,th {
font-family: Verdana, Geneva, sans-serif;
}
body {
background-color: #CCC;
}
</style>
<link href="Css/ghute Website.css" rel="stylesheet" type="text/css" />
<meta name="keywords" content="Webdesign,Webentwicklung,Grafikdesign" />
<meta name="description" content="Die Website von mir. Gratis Vide Tutos" />
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0;
}
</script>
</head>

<body>
<div id="wrapperarea">
<div id="logo"><a href="gute Website.html"><img src="Images/logo.png" width="242" height="41" alt="logo" /></a></div>
<div id="navigation">
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a class="MenuBarItemSubmenu" href="gute website.html">Home</a>
<ul>
<li><a href="#">Forum</a></li>
<li><a href="Partnerseiten.html">Partnerseiten</a></li>
</ul>
</li>
<li><a href="Über uns.html">Über uns</a></li>
<li><a href="registrieren.html" class="MenuBarItemSubmenu">Registrieren</a>
<ul>
<li><a href="login.html">Login</a></li>
<li><a href="login.html">Logout</a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Die ESL</a>
<ul>
<li><a href="die esl.html">Was ist das?</a></li>
<li><a href="die clans.html">Die Clans</a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Spenden</a>
<ul>
<li><a href="#">Kontodaten</a></li>
<li><a href="#">Spenden Optionen</a></li>
</ul>
</li>
</ul>
</div>
<div id="header"></div>
<div id="contentarea">
<div id="textarea">
<h1><p>Willkommen bei Clan XY</p></h1>
<h2><p>Wer sind wir überhaupt?</p></h2>
<p>Hallo erstmal,<br />
wir sind ein Counter-Strike-Srouce Clan, der im April 2011 von den folgenden drei Mitgliedern gegründet wurde.</p>
<ul>
<center>
<li>Windassel</li>
</center>
<center>
<li>Santa Claus und</li>
</center>
<center>
<li>Skill_BoT</li>
</center>
</ul>
<p> Unser Clan ist hauptsächlich darauf ausgelegt, dass wir de_Maps spielen. Dazu zählt vorallem de_dust2.
Zurzeit bestehen wir aus drei Mitgliedern, wobei die Anzahl unserer Member stetig steigt. Unser Ziel ist es, dass wir bei der ESL mitspielen können. </p><hr />
<h2><p>Wie könnt Ihr uns beitreten?</p></h2>
<p>Wie im richtigen Berufsleben ist es so, dass man eine Bewerbung an einen Betrieb schreiben muss, bevor man dort arbeiten kann. Natürlich ist das auch bei uns so, nur der Unterschied ist, dass wir kein Betrieb sondern ein Clan sind. Nichts desto trotz, würden wir dich bitten, deine Bewerbung in unser Forum zu posten, damit wir dich besser kennen lernen können, und darüber entscheiden werden, ob du aufgenommen wirst, oder nicht. Klick einfach hier.</p><hr />
<h2><p>Unser(e) Server im Überblick</p></h2>
<p>***</p><hr /> <br />
<center>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="400" height="226" id="FLVPlayer1">
<param name="movie" value="FLVPlayer_Progressive.swf" />
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="scale" value="noscale" />
<param name="salign" value="lt" />
<param name="FlashVars" value="&MM_ComponentVersion=1&skinName=Clear_Skin_1&streamName=Medien/cssprogamer&autoPlay=false&autoRewind=false" />
<param name="swfversion" value="8,0,0,0" />

<param name="expressinstall" value="Scripts/expressInstall.swf" />


<object type="application/x-shockwave-flash" data="FLVPlayer_Progressive.swf" width="400" height="226">

<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="scale" value="noscale" />
<param name="salign" value="lt" />
<param name="FlashVars" value="&MM_ComponentVersion=1&skinName=Clear_Skin_1&streamName=Medien/cssprogamer&autoPlay=false&autoRewind=false" />
<param name="swfversion" value="8,0,0,0" />
<param name="expressinstall" value="Scripts/expressInstall.swf" />

<div>
<h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
<p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/…lash_player.gif" alt="Get Adobe Flash player" /></a></p>
</div>

</object>

</object>
</center>
</div>
<div id="sidebar">
<form action="php/auswertung.php" method="get" enctype="application/x-www-form-urlencoded" name="user_registrierung">
<p>Neu hier?, dann <a href="file:///C:/Users/Marius/Desktop/Test%20Website/registrieren.html">registriere</a> dich doch bitte, oder melde dich an<p> <br />
<label type="username">Benutzername:</label> <br />
<input name="username" type="text" value="Dein Benutzername" size="25" maxlength="30" /> <br /> <br />
<label type="password">Passwort:</label> <br />
<input name="password" type="password" value="Dein Passwort" size="25" maxlength="25" /> <br /> <br />
<input type="checkbox" name="agb" id="agb" /> <label for="agb">Ich bin mit den <a href="file:///C:/Users/Marius/Desktop/Test%20Website/nutzerbedingungen.html">Nutzerbedingungen</a> einverstanden</label> <br /> <br />
<input type="submit" value="Jetzt anmelden" />
<input type="reset" value="Zurück setzen" /> <hr /> <br />

<h2>Benutzer Übersicht</h2> <br />

<list><li><span style="color:#900">Administratoren</span></li></list>
<list><li><span style="color:#0C0">Moderatoren</span></li></list>
<list><li><span style="color:#666">Counter-Strike-Source-Mitglieder</span></li></list>
<list><li><span style="color:#CCC">Normale User</span></li></list> <hr /> <br /> <br />

</form>
</div>
<div id="footer"></div>
</div>
</div>
<div style="OVERFLOW: auto; width; 315px; height: 200px"></div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
var Accordion1 = new Spry.Widget.Accordion("Accordion1");
swfobject.registerObject("FLVPlayer");
swfobject.registerObject("FLVPlayer1");
swfobject.registerObject("FLVPlayer");
</script>
</body>
</html>

Ich hoffe, dass Ihr mir helfen könnt:/
Danke

threadi

Der HTML-Code selbst ist schonmal sehr fehlerhaft.

Du verwendest z.B. <center>, welches man eigentlich gar nicht mehr nutzen sollte (Zentrierung wird per CSS erreicht) und noch dazu steht es an einer Stelle an der es nicht hingehört (zwischen <ul> und <li> darf nichts anderes stehen).

Außerdem gibt es das Element <list> nicht beim XHTML 1.0-Standard, welchen dein Doctype angibt.

Mach erstmal den HTML-Code valide bevor Du sich weiter um die Darstellung kümmerst.

alles verstellt, bitte helfen :(

Tags

Benutzer online in diesem Thema