Brandneue HTML/CSS-Benutzer hier! Ich bin mir sicher, dass es eine einfache und elegante Möglichkeit gibt, dieses Problem zu lösen, aber ich konnte es nicht finden.Abschnitt mit Text überlappt einen Abschnitt mit einer ungeordneten Liste
Ich habe derzeit vier Abschnitte in meinem Code, und die letzteren drei scheinen genau so zu fallen, wie ich in Bezug aufeinander erwarten würde, einer nach dem anderen, aber der zweite überlagert sich über dem ersten. Ich habe das umgangen, indem ich eine ID zum zweiten Abschnitt hinzugefügt habe, die ihm etwas Auffüllen gibt, aber wie Sie sehen werden, paddelt es vom oberen Rand der Seite, nicht vom darüberliegenden Bereich. Wenn ich diese Polsterung wegnehme, überlappt sich "Über mich" über dem Hintergrund des ersten Abschnitts, der die Links enthält.
#firstlink {
padding: 15px 50px 0px 0px
}
#linkbar {
background-color: blue;
height: 15%;
position: absolute;
top: 0;
left: 0;
width: 100%;
}
li {
font-size: 35px;
padding: 15px 10px 0px 0px;
float: right;
display: inline;
}
#aboutme {
padding: 75px 0px 0px 0px;
}<section id="linkbar">
<ul>
<li id="firstlink">link1</li>
<li>link2</li>
<li>link3</li>
</ul>
</section>
<section id="aboutme">
<h1>About Me</h1>
</section>
<section>
<h1>My Portfolio</h1>
</section>
<section>
<h1>Contact Me</h1>
</section>
vielen Dank für die sehr schnelle Antwort. Ich habe versucht, das Absolute von #linkbar zu entfernen, aber wenn ich das Padding von #aboutme wegnehme, überlappt es immer noch mit dem oberen Abschnitt, und auch wenn ich das Absolute von #linkbar wegnehme, verschwindet die Hintergrundfarbe –
, die nicht zu lösen scheint Das Problem der Überlappung, als ob ich den Schwimmer entfernen: rechts, und dann entfernen Sie die Auffüllung von #aboutme die Überlappung noch auftritt, und zusätzlich bewegt es meine Links von der Position, wo ich sie will –