Brauche Hilfe beim Content

Chriss0r · 02.01.2009

Meine Seite ist nun schon fast fertig gecodet, ich hab aber Probleme beim Content Bereich.
Kann CSS noch nicht so gut, und hab quasi mit dieser Seite wieder damit angefangen.
Wäre nett wenn mir jemand sagen wie ich es am besten slice und wie ich die divs anordnen muss, weil genau dabei hab ich Probleme, soll ja schließlich auch GUT und Optimiert sein und nicht einfach nur hingeklatscht.

also helft mir bitte etwas auf die Sprünge, wäre echt super nett.
danke im vorraus

Top_Gun · 02.01.2009

AW: Brauche Hilfe beim Content

Tut mir leid auf dem Bild kann ich weder etwas erkennen noch verstehe ich was du haben willst.

Chriss0r · 02.01.2009

AW: Brauche Hilfe beim Content

Na ich wollte meine Seite Coden, aber komme bei der Content Box nicht weiter, alles unwichtige hab ich auf dem Bild unscharf gemacht, da es ja keine rolle spielt, weil ich das ja eh in den Container Packe der auch schon richtig positioniert ist.

Brauch halt jetzt nur noch das gecodet in CSS was auf dem Bild ist, und da weiß ich nicht wie ich das slicen muss, und wo ich divs machen muss

tiroler · 02.01.2009

AW: Brauche Hilfe beim Content

stell mal deinen bisherigen code rein

maromedia84 · 02.01.2009

AW: Brauche Hilfe beim Content

Ja ich tu mir auch schwer auf dem Bild was zu erkennen. Wäre nett wenn ein besseres Bild und deinen Html wie auch CSS Code postest!!!! Bei so einem Bild und ohne Code kann und wird dir wahrscheinlich keiner so schnell helfen können.

Chriss0r · 02.01.2009

AW: Brauche Hilfe beim Content

wie gesagt bin nen anfänger^^

Code:

<html>
<head>
<title>TEST</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>

body {
    margin: 0;
	background-color:#353535;
}

.header {
	background-image:url(images/header.png);
	height:228px;	
}

.container {
	margin-left:auto;
	margin-right:auto;
	width:891px;
}

.naviContainer {
	margin-left:16px;
	background-image:url(images/images_04.png);
	height:39px;
	
}

.naviBorder {
	background-image:url(images/images_03.png);

	width:5px;
	height:39px;
	float:left;
	
}

.naviKNOPF { 
	padding-left:15px;
	padding-right:15px;
	height:39px;
	line-height:32px;
	
}

.naviContainer a {
	float:left;
	
}

.naviDivide {
	background-image:url(images/navi_divide.png);
	width:2px;
	height:39px;
	float:left;
}

.naviEnd {
	background-image:url(images/images_08.png);
	float:right;
	height:39px;
	width:500px;
}

.contentContainer {
	width:891px;
}

.content {
	margin-top:24px;
	margin-left:15px;
	background-color:#000;
	width:668px;
	float:left;
	margin-bottom:24px;
}

.subContainer {
	float:right;
	margin-bottom:5px;
}

.subHeader {
	background-image:url(images/images_12.png);
	height:77px;
	width:199px;	
}

.subHeader2 {
	background-image:url(images/images_32.png);
	height:22px;
	margin-right:23px;
}

.subContent {
	background-image:url(images/images_40.png);
	margin-right:23px;	
}

.footerContainer {
	width:854px;
	background-image:url(images/footer.png);
	height:60px;
	clear:both;
	margin-left:15px;
}

</style>
</head>
<body>
<div class="container">

	<div class="header">
	</div>
    
    <div class="naviContainer">
    	<div class="naviBorder">
        </div>
        	<a class="naviKNOPF" href="index.php?fupage">News</a>
        	<div class="naviDivide"></div>
        
            <a class="naviKNOPF" href="index.php?fupage">Blog</a>
        	<div class="naviDivide"></div>
            
            <a class="naviKNOPF" href="index.php?fupage">Portfolio</a>
        	<div class="naviDivide"></div>
            
            <a class="naviKNOPF" href="index.php?fupage">Stuff</a>
        	<div class="naviDivide"></div>
        
            <a class="naviKNOPF" href="index.php?fupage">About</a>
        	<div class="naviDivide"></div>
    	        
			<div class="naviEnd"></div>
	
						
	</div> 
    
    <div class="contentContainer">
    
    	<div class="content">
        	<div class="contentHeader">
            
            </div>
            <div class="contentContent">
            
            </div>
            <div class="contentFooter"></div>

    	</div>
    
   	  <div class="subContainer">
        	<div class="subHeader"></div>
          		<div class="subHeader2"></div>
            	<div class="subContent">
			
			<br />
        		</div>     
      </div>
           
	</div>
    
	<div class="footerContainer">

	</div> 

</div>
</body>
</html>

leohh · 03.01.2009

AW: Brauche Hilfe beim Content

soll ja schließlich auch GUT und Optimiert sein und nicht einfach nur hingeklatscht.

Dann solltest du deinen bisherigen Quellcode noch ein bisschen optimieren, denn im Moment verfaellst du zu sehr ins 'diven'. Dein geposteter Quellcode vermittelt ueberhaupt keine Bedeutung soweit. Deine Elemente solltest in deinem Markup nach ihrer Bedeutung benennen - fuer Ueberschriften h1-h6, Menues sind in den meisten Faellen sog. Listenpunkte ( ol, ul, dt ) und einem footer reicht meist auch ein Paragrah (p-Elemente) wenn ich das jetzt richtig sehe, wuerde ich sogar noch ein hr-Element im Footer verwenden, der Traeger des blauen Schmuckbildes sein koennte.

Den IE wirst du so, mit hoher Wahrscheinlichkeit, direkt in den Quirks schicken (fehlender !Doctype),
zu einem Stylesheet gehoert immer noch der MIME-Type text/css.

Ansonsten kann man ohne wirkliches Onlinebeispiel immer noch sehr wenig sagen - zumindest ich. Dein Content, sieht mir sehr schwarz aus, was bedeuten koennte, dass du evtl. nicht wirklich etwas zu slicen brauchst - den Teil direkt auslassen koenntest und ihm einfach nur ein backgroundcolor:#000; zuweissen muesstest. Aber man kann auf dem Bild nach wie vor nichts erkennen.

Ein Onlinebeispiel oder ein besseres Bild, waere schon sehr hilfreich.