Ich versuche meine erste Website zu bauen und habe ein Problem! Die linken und rechten Kästchen - "leftSidebar" und "rightSidebar" - sollen neben dem mittleren Inhalt sein (links und rechts davon), aber sie gehen nur durch den Körper und sind es nicht in der Body Box (mit Grenzen getestet). Was mache ich falsch? Ich möchte die linke und rechte Seitenleiste neben dem mittleren Inhalt haben!CSS - Boxen in Box
Außerdem kreuzen sie die Bodybox so weit nach unten, dass - wenn ich runterscrolle - mein Hintergrund aufhört und ein weißer Hintergrund erscheint! Vielleicht kannst du es mit einem Hintergrund von dir selbst testen?
Bitte helfen Sie mir so bald wie möglich, goin Cray bereits
Dank
body {
\t background-image: url(wp1.jpg);
\t background-size: 100%;
background-repeat: no-repeat;
\t color: white;
}
.body {
\t width: 70%;
\t border: 1px solid white;
\t margin: 5% auto;
\t clear: both;
\t
}
a {
\t text-decoration: none;
}
nav ul li {
\t list-style-type: none;
}
.navHeader nav ul li {
\t float: left;
\t display: inline;
\t margin: 0 auto;
}
.navHeader nav {
\t border-radius: 5px;
\t border: 1px dashed white;
\t height: 50px;
}
.navHeader {
\t background-color: black;
}
.leftSidebar {
\t float: left;
\t border: 1px white solid;
\t border-radius: 2px;
\t margin: 2% 0 2% 2%;
\t width: 20%;
\t
}
.rightSidebar {
\t float: right;
\t border: 1px white solid;
\t border-radius: 2px;
\t margin: 2% 0 2% 2%;
\t width: 20%;
}
.allContent {
\t background-color: black;
\t width: 60%;
\t text-align: center;
\t margin: 0 auto;
}
\t <body class="body">
\t
\t <header class="navHeader">
\t \t <nav><ul>
\t \t \t <li><a href="#">Home</a></li>
\t \t \t <li><a href="#">News</a></li>
\t \t \t <li><a href="#">Programming</a></li>
\t \t \t <li><a href="#">Downloads</a></li>
\t \t \t <li><a href="#">Contact</a></li>
\t \t </nav></ul>
\t </header> \t
\t
\t
\t \t <aside class="leftSidebar">
\t \t \t <content>
\t \t \t \t <h3> Sidebar Left Title </h3>
\t \t \t \t \t <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
\t \t \t \t \t Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
\t \t \t </content>
\t \t </aside>
\t \t
\t \t \t \t
\t
\t \t
\t \t <aside class="rightSidebar">
\t \t \t <content>
\t \t \t \t <h3> Sidebar Right Title </h3>
\t \t \t \t \t <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
\t \t \t \t \t Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
\t \t \t </content>
\t \t </aside>
\t \t
\t <div class="allContent">
\t
\t \t <article class="middleContent">
\t \t \t <content>
\t \t \t \t <h2> This Is A Post </h2>
\t \t \t
\t \t \t \t \t <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
\t \t \t \t \t Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
\t \t \t \t \t <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
\t \t \t \t \t Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
\t \t \t </content>
\t \t </article>
\t \t
\t \t <footer class="footerdown">
\t \t \t <p>Copyright © <a href="#" title="black papiyon">blackpapiyon.com</a></p>
\t \t </footer>
\t
\t </div>
\t
\t
\t </body>
</html> \t
Entschuldigung, ich bin mir nicht sicher, was du meinst, vielleicht könntest du ein Bild von dem, wie du willst, posten? – joshhunt
Schau, ich versuche einen mittleren Inhalt zu haben ("Klasse middleContent") und links davon versuche ich, meine linke Seitenleiste zu platzieren, und rechts davon versuche ich eine zu setzen rechte Sidebar. Alle diese sind in meinem Körper ofc ... Die rechte Seitenleiste ist unter dem Körper lol, und die linke Seitenleiste ist innerhalb des Körpers, sondern überquert die untere Grenze von ... einfach in Ihrem Editor einfügen und Sie werden Wissen Sie, was ich meine, falls Sie es nicht verstanden haben – kendrickLamar