nicht angemeldet
Hallo,
den Link hatte ich nicht gesehen, normalerweise stehen dort die Links zur Homepage des Besuchers.
In deinem Quelltext befinden sich leider einige Fehler und Unsauberkeiten. Die Namen der id und class gehören in Anführungszeichen. Text sollte nie direkt in Containern stehen sondern in geeigneteren Elementen wie h1 bis h6, p, li u.s.w.
Ich habe mal eine Lösung erstellt, wie sie mir nach deinen bisherigen Infos vorschwebt:
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8"><!-- Schließende Slashes sind unter HTML5 nicht erforderlich, aber erlaubt -->
<title>Trennbalken im Text</title>
<meta name="description" content="HTML5, CSS3">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Um alte IE HTML5-tauglich zu machen -->
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js" language="javascript" type="text/javascript"></script>
<![endif]-->
<!-- Internes CSS ("type="text/css" ist unter HTML5 nicht erforderlich) -->
<style>
/* Neue HTML5-Elemente für ältere Browser als Block-Elemente übergeben */
header, nav, main, aside, footer, section, article, figure, figcaption, audio, video {
display: block;
}
* {
-moz-box-sizing: border-box;
box-sizing: border-box;
}
html {
font-size: 120%;
}
body {
padding: 0;
}
p {
}
* {
margin: 0;
}
#inhalt {
width: 100%;
background: #FF0000;
}
#inhalt .wrapper {
margin: 0 auto;
}
#inhalt .balken {
background-color: black;
width: 100%;
}
#inhalt .wrapper h2 {
background: #fff;
line-height: 2;
max-width: 500px;
margin: 0 auto;
}
#inhalt .wrapper p {
background: #fff;
max-width: 500px;
margin: 0 auto;
}
</style>
</head>
<body>
<div id="inhalt">
<div class="wrapper">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo liguladio. Maecenas ullamcorper, dui et placerat feugiat, eros pede varius nisi, condimentum viverra felis nunc et lorem.Sed magna purus, fermentum eu, tincidunt eu, varius ut, felis. In auctor lobortis lacus. Quisque libero metus, condimentum nec, tempor a, commodo mollis, magna. Vestibulum ullamcorper mauris at ligula. Fusce fermentum. Nullam cursus lacinia erat. Praesent blandit laoreet nibh. Fusce convallis metus id felis luctus adipiscing. Pellentesque egestas, neque sit amet convallis pulvinar, justo nulla eleifend augue, ac auctor orci leo non est. Quisque id mi. Ut tincidunt tincidunt erat. Etiam feugiat lorem non metus. Vestibulum dapibus nunc ac augue. Curabitur vestibulum aliquam leo. Praesent egestas neque eu enim. In hac habitasse platea dictumst. Fusce a quam. Etiam ut purus mattis mauris sodales aliquam. Curabitur nisi. Quisque malesuada placerat nisl. Nam ipsum risus, rutrum vitae, vestibulum eu, molestie vel, lacus. Sed augue ipsum, egestas nec, vestibulum et, malesuada adipiscing, dui. Vestibulum facilisis, purus nec pulvinar iaculis, ligula mi congue nunc, vitae euismod ligula urna in dolor. Mauris sollicitudin fermentum libero. Praesent nonummy mi in odio.</p>
<div class="balken">
<h2>Dies ist im Balken</h2>
</div>
<p>HIER BEGINNT DER ZWEITE TEIL Nunc interdum lacus sit amet orci. Vestibulum rutrum, mi nec elementum vehicula, eros quam gravida nisl, id fringilla neque ante vel mi. Morbi mollis tellus ac sapien. Phasellus volutpat, metus eget egestas mollis, lacus lacus blandit dui, id egestas quam mauris ut lacus. Fusce vel dui. Sed Nunc interdum lacus sit amet orci. Vestibulum rutrum, mi nec elementum vehicula, eros quam gravida nisl, id fringilla neque ante vel mi. Morbi mollis tellus ac sapien. Phasellus volutpat, metus eget egestas mollis, lacus lacus blandit dui, id egestas quam mauris ut lacus. Fusce vel dui.</p>
</div>
</div>
</body>
</html>
Gruss
MrMurphy
Gunnar Bittersmann
robertroth
Tabellenkalk