Guten Abend,
irgendwie habe ich hier ein Denkfehler und bekomme keine andere Hintergrundfarbe zustande und bitte um Hilfe.
Es geht um die ID "wuerfe"
PHP
- <!doctype HTML>
- <html lang="de">
- <head>
- <meta charset="UTF-8">
- <title>Überblick Wurfmeldungen der Rasse Maine Coon</title>
- <meta name="description" content="Ein Überblick unsere Würfe der Rasse Maine Coon">
- <meta name="author" content="Puschelreich - Monique Sommer, David Jähnel">
- <meta name="keywords" content="Wurfmeldungen, Katzenbabys, A-Wurf, B-Wurf, C-Wurf, Maine Coon Babys, Einzelkitten">
- <link href="https://www.puschelreich.de/design.css" rel="stylesheet">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
- <!--[if IE]>
- <script
- src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6.1/html5shiv.js"
- ></script>
- <![endif]-->
- </head>
- <body>
- <div id="wrapper">
- <header>
- <!-- Kopfzeile -->
- </header>
- <?php include ("../../../steuerungoben.html"); ?>
- <div class="flex-container">
- <nav id="steuerunglinks">
- <ul>
- <li><a href="http://puschelreich.de/index.php">Startseite</a></li>
- <li><a href="http://puschelreich.de/puschels/index.php">Puschels</a></li>
- <ul>
- <li id="wuerfe"><a href="https://www.puschelreich.de/puschels/kitten/a-wurf/index.html">A-Wurf - 29.03.2016</a></li>
- <li><a href="https://www.puschelreich.de/puschels/kitten/a-wurf/abby.html">Abby</a></li>
- <li><a href="https://www.puschelreich.de/puschels/kitten/a-wurf/amira.html">Amira</a></li>
- <li><a href="https://www.puschelreich.de/puschels/kitten/a-wurf/adonis.html">Adonis</a></li>
- <li><a href="https://www.puschelreich.de/puschels/kitten/a-wurf/akimba.html">Akimba</a></li>
- <li><a href="https://www.puschelreich.de/puschels/kitten/a-wurf/akiro.html">Akiro</a></li>
- <li><a href="https://www.puschelreich.de/puschels/kitten/a-wurf/aladin.html">Aladin</a></li>
- <li><a href="https://www.puschelreich.de/puschels/kitten/a-wurf/apollo.html">Apollo</a></li>
- <ul></ul>
- </ul>
- <li><a href="http://puschelreich.de/bilder.html">Bilder</a></li>
- <li><a href="http://puschelreich.de/über%20uns%20dosenöffner.html">Über uns Dosenöffner</a></li>
- <li><a href="http://www.puschelreich.de/infos/index.html">Infos</a></li>
- <li><a href="http://www.puschelreich.de/aktuelle%20news/index.php">Neuigkeiten</a></li>
- <li><a href="http://www.puschelreich.de/katzenblog/index.html">Katzenblog</a></li>
- <li><a href="http://www.puschelreich.de/Kontakt.php">Kontakt</a></li>
- </ul>
- </nav>
- <section>
- <h1>Aktuelle Wurfmeldungen und Kittenabgabe</h1>
- <p id="starkeschrift">Aktuell haben wir keine Kitten abzugeben!</p>
- <p>Unsere Kitten werden frühstens mit der 12. Lebenswoche ausziehen.
- Sie sind dann mehrfach entwurmt, 2-fach geimpft, erhalten einen Stammbaum
- und ein kleines Fress-Paket für die ersten Tage im neuen Zuhause.
- </p>
- <p>Sollten Sie Interesse haben, dann können Sie uns jederzeit unter
- info@puschelreich.de kontaktieren.
- </p>
- <p>Auch Züchterfreunde sind bei uns immer herzlich willkommen.</p>
- <hr />
- </section>
- <aside>
- <img src="C-Wurf_Gruppenbild.jpg" width="155" height="230" alt="C-Wurf - Einzelkind" title="C-Wurf - Einzelkind">
- <img src="B-Wurf_Gruppenbild.jpg" width="155" height="116" alt="B-Wurf" title="B-Wurf">
- <img src="A-Wurf_Gruppenbild.jpg" width="155" height="116" alt="A-Wurf" title="A-Wurf">
- </aside>
- </div>
- <?php include ("../../../footer.html"); ?>
- </div>
- </body>
- </html>
Code
- * {
- margin: 0;
- padding: 0;
- }
- body {
- display: flex;
- flex-flow: row wrap;
- text-align: center;
- background-image: url(onewebmedia/Hintergrund2.jpeg);
- background-attachment: fixed;
- font-family: Arial, sans-serif;
- }
- header, footer {
- flex: 1 100%;
- }
- section {
- flex: 3;
- }
- aside {
- flex: 1;
- }
- header {
- /* background-color: yellow; */
- background-image: url(Homepage/Shadow.jpg);
- height: 200px;
- }
- header p {
- /* background-color: orange; */
- text-align: right;
- padding: 15px;
- }
- #steuerungoben {
- /* background-color: red; */
- -ms-flex-direction: column;
- flex-direction: column;
- background-image: url(Bilder/hintergund-grey.png);
- }
- #steuerungoben ul {
- display: flex;
- list-style-type: none;
- }
- #steuerungoben li {
- display: flex;
- }
- #steuerungoben a {
- display: block;
- width: 15em;
- /* background-color: yellow;*/
- /*float: left;*/
- /* border-right: 1px red solid; */
- color: white;
- text-decoration: none;
- line-height: 24px;
- text-align: center
- }
- #steuerungoben a:hover {
- background-image: url(Bilder/hintergrund-black.png);
- }
- .flex-container {
- display:flex
- }
- #steuerunglinks {
- /* background-color: green; */
- width: 250px;
- }
- #steuerunglinks ul {
- padding-left: 1em;
- padding-top: 20px;
- list-style-type: none
- }
- #steuerunglinks a {
- color: #dd9661;
- line-height: 30px;
- }
- #wuerfe li {
- background-color: black;
- }
- aside {
- background-color: #808000;
- width: 175px;
- display: flex;
- flex-direction:column;
- align-content: center;
- align-items: center;
- }
- aside>img,
- aside>a {
- margin-top: 20px;
- }
- section h1 {
- padding-top: 20px;
- padding-bottom: 0.4em;
- color: #dd9661;
- }
- section h2 {
- color: #dd9661;
- padding-top: 1em;
- padding-bottom: 0.6em;
- }
- section p {
- padding-bottom: 1em;
- }
- #starkeschrift {
- font-weight: bold;
- }
- footer {
- background-color: brown;
- background-image: url(Bilder/hintergund-grey.png);
- text-align: center;
- color: white;
- clear: both;
- }
- #wrapper {
- /* background-color: #eeeeee; */
- width: 60em;
- margin: 0 auto;
- text-align: left;
- background-image: url(hintergrund-durch.png);
- }