• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Nach Umstellung auf html5 wird CSS nicht mehr richtig dargestellt

Schippinho

Neues Mitglied
Ich bin selber Laie was css betrifft und habe ein Problem, bei dem ich einfach nicht weiterkomme. Damit JavaScript im iE richtig dargestellt wird, muss ich auf html5 umstellen.

Website: Move-It Sportcamps | Ferienfreizeiten fr Kinder und Jugendliche

Nun hat mir die Umstellung auf html5 allerdings meine "leftsidebar" zerschossen und die css-Formatierungen werden dort teilweise nicht mehr angenommen.

Vorher mit <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> :

richtig.jpg


Nach der Umstellung auf <!DOCTYPE HTML>

fehler.jpg


Die leftsidebar wird über .php include in die einzelnen Seiten eingebunden.


Hier der html Code für den Bereich der Leftsidebar:

<div id = 'ContentArea'>
<div id="LeftArea">
<div class="LeftBlock">
<div class="title_b">
<div class="title_r">
<div class="title_l">
<span>Move-It Sportcamps</span>
</div>
</div>
</div>
<ul> <b>

<li><a href="news.php">Move-It News</a></li>
<li><a href="move-it-angebot.php">Sportcamp Angebot</a></li>
<li><a href="team.php">Unser Team</a></li>
<li class="last"><a href="termine-preise.php">Termine & Preise</a></li>
</b></ul>
</div>


und hier die css Programmierung:

/********** Left Area **********/
#LeftArea{ float:left; width:191px; padding:18px 10px 0px 10px; background:url( '../images/side_top_b.gif' ) left top repeat-x; }
#LeftArea div.leftBlock{ background-color:#DBDBDB; margin-bottom:18px; clear: both;}

#LeftArea div.LeftBlock div.title_b{ background:url('../images/left_block_b.jpg') repeat-x; }
#LeftArea div.LeftBlock div.title_l{ background: transparent url('../images/left_block_l.jpg') left center no-repeat; height:29px;}
#LeftArea div.LeftBlock div.title_r{ background: transparent url('../images/left_block_r.jpg') right center no-repeat; }
#LeftArea div.LeftBlock div.title_b span{ line-height:29px; padding-left:18px; color:#FFFFFF; font-size:13px;
font-weight:bold; background:none left center no-repeat; }

#LeftArea div.leftBlock ul{ display: block;margin:0px; padding:0px 0px 0px 0px; border:solid 1px #d6d6d6; background-color:#f5f5f5;}

#LeftArea div.leftBlock li{
display: block;
margin: 0;
padding: 0;
height:29px;
line-height:29px;
list-style:none;
font-weight: bold;
background-color:#FAFAFA;
border-left: 0px solid #CCCCCC;
border-top: 0px solid #CCCCCC;
border-right: 0px solid #CCCCCC;
border-bottom: 1px solid #d6d6d6;
}


--

Ich bin mit meinem Latein am Ende und wäre über Tipps dankbar wie ich es hinbekomme das die Leftsidebar wieder normal angezeigt wird.

Vielen Dank und Grüße aus Köln,
Christoph
 
Die Seite hat aktuell keinerlei Doctype. Außerdem müsstest Du für HTML5 auch den <head>-Bereich noch etwas entmüllen.
 
Zurück
Oben