# darstellungsfehler?



## Andre267 (11. Juni 2013)

Schönen guten Abend/Morgen,

irgendwie glaube ich das mein Browser spinnt...
Ich habe was ganz einfaches geschrieben, aber es wird einfach irgendwie nicht dargestellt.

(folgende Klassen: heady, cont, footy(teilweise fehlerhaft))

Was mache ich falsch?

_index.php_

```
<!DOCTYPE html>
<?php
	##Relevanten Datein includieren
	include("inc/func.php");
	
	$func = new func();

?>
<html lang="de">
	<head>
		<meta charset="UTF-8"/>
		<title><?php echo $func->get_title(); ?></title>
		<link rel="stylesheet" type="text/css" href="css/style.css">
	</head>
	<body>
		<section class="wrapper">
		
			<header class="header">
				<span class="headerTitle"><?php echo $func->get_title(); ?></span>
				<nav>
					<ul>
						<li><a href="?site=Home">Home</a></li>
						
						<li><a href="?site=gen">generieren</a></li>
					</ul>
				</nav>
			</header>
			
			<article class="content">
				<section class="heady">
					<h1>Test</h1>
				</section>
				<section class="cont">
					Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
				</section>
				<footer class="foty"><p>Autor: Andre</p><p>Datum: 11.06.2013</p></footer>
			</article>
			
			<footer class="footer">
				(C) by Andre - 2013
			</footer>
			
		</section>
	</body>
</html>
```


```
body{
	text-align: auto center;
	margin: 0 auto;
	padding: 0;
}

.wrapper{
	border: 1px solid black;
	width: 600px;
	height: 800px;
	background-color: red;
	position: absolut;
	margin: 0 auto;
	padding: 0px;
	margin-top: 20px;
	text-align: center;
}

.header{
	height: 150px;
	width: 600px;
	background-color: green;
	margin: 0;
	padding: 0;
	position: absolute;
	text-align: left;
}

.headerTitle{
	font-size: 1.8em;
	font-weight: bold;
	background-color:black; 
	filter:alpha(opacity=60); 
	opacity:.6;
	color: white;
	padding: 2px;
	margin: 0;
	padding-right: 20px;
	padding-left: 20px;
}

nav ul{
	margin: 0;
	padding: 0;
	margin-top: 92px;
	list-style-type: none;
	background-color:black; 
	filter:alpha(opacity=60); 
	opacity:.6;
	text-align: center;
}

.header nav ul li{
	display: inline;
	margin: 8px;
}

.header nav ul li a{
	text-decoration: underlined;
	color: white;
}

.header nav ul li a:hover{
	text-decoration: none;
}

.content{
	margin: 0 auto;
	width: 600px;
}

.heady{
	background-color: black;
}

.heady h1{
	color: white;
	margin: 0;
	padding: 0;
	font-size: 1.2em;
}

.cont{
	background-color: white;
	color: black;
}

footer .footy{
	color: white;
	background-color: black;
	display: inline;
}
```

Live Ansicht: http://anide.de/dev/blub/

Weiß jemand was ich falsch mache?


----------



## Carrear (11. Juni 2013)

Was wird denn da nicht dargestellt? Also ich sehe hier eine Seite mit grünem Header und rotem Inhaltsbereich.


----------



## Andre267 (11. Juni 2013)

Andre267 hat gesagt.:


> (folgende Klassen: heady, cont, footy(teilweise fehlerhaft))
> 
> 
> ```
> ...



Wie _*oben*_ beschrieben.


----------



## PuReSteeL (12. Juni 2013)

Hi Andre,

gib dem header mal bei der Positions-Angabe statt absolute lieber relative:


```
.header{
    height: 150px;
    width: 600px;
    background-color: green;
    margin: 0;
    padding: 0;

    position: relative;

    text-align: left;
}
```

Sonst rückt dein Content, hinter den Header.


----------



## Andre267 (13. Juni 2013)

Vielen Dank.
Das war des Rätsels Lösung.


----------

