2 Replies - 296 Views - Last Post: 27 April 2020 - 01:27 PM

#1 kukas   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 5
  • Joined: 21-April 20

I got a little problem with my background image

Posted 24 April 2020 - 03:08 PM

Hello Guys,
so I created myself a DIV underneath my navbar and now a part of my background is popping up when scrolling down.
I dont know how I can fix that and maybe you guys can help me :)

This is the HTML-Code:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./style.css">
    <link href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap" rel="stylesheet">
    <title>SpaceX</title>
    <link rel="icon" href="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRLQ8hknzo_SWsMSGg-1xaFXIQLYsvtqMkdyPE857E9NlOo9V9a">
</head>
<body>
    <nav>
        <div class="logo">
            <a href="index.html"><img src="https://cdn.freebiesupply.com/logos/large/2x/spacex-logo-black-and-white.png" width="150"/></a>
        </div>
        <ul class="nav-links">
            <li><a href="index.html">Home</a></li>
            <li><a href="#">Einrichtungen</a></li>
            <li><a href="#">Technologie</a></li>
        </ul>
    </nav>
    <div class="heading">
        <h1>TECHNOLOGIE</h1>
    </div>
    <section class="main">
        <div class="container" style="max-width: 60%;">
            <div class="box">
                <div>
                    <h2>Falcon 1</h2>
                    <p>Der erste Testflug der leichten Falcon-1-Rakete erfolgte nach mehrfachen Startverschiebungen seit September 2004 am 24. März 2006, endete jedoch mit dem Absturz der Rakete aufgrund eines Treibstofflecks. Danach tagte eine von SpaceX und dem US-Verteidigungsministerium eingesetzte Untersuchungskommission. Beim zweiten Testflug am 21. März 2007 erreichte die Rakete eine Höhe von 300 Kilometern. Die zweite Raketenstufe aber kollidierte beim Abtrennen mit der Austrittsdüse der ersten Stufe. Dies war vermutlich der Grund für das Ablösen eines Stabilisierungsrings, wodurch die Oberstufe ins Taumeln und außer Kontrolle geriet. Laut SpaceX konnten die gestörten Telemetriedaten nachträglich weitgehend wiederhergestellt werden. Die Oberstufe stürzte zurück in die Erdatmosphäre. Der dritte Testflug am 3. August 2008 schlug erneut fehl. Der Start verlief anfangs wie erwartet, jedoch traten bei der Stufentrennung Probleme auf, und die Rakete geriet außer Kontrolle. Der vierte Flug am 28. September 2008 glückte. Hierbei wurde der gleiche Triebwerkstyp (Merlin C) wie beim vorherigen Flug verwendet. Durch die Behebung des Fehlers bei der Stufentrennung konnte die Falcon 1 ihre 165 kg schwere Probenutzlast in einem 644 km hohen Orbit aussetzen. Am 14. Juli 2009 wurde Falcon 1 mit dem Start des malaysischen Satelliten RazakSAT erstmals kommerziell verwendet.</p>
                </div>
                <div>
                    <img src="https://cdn.prod.www.spiegel.de/images/e74fbdd6-0001-0005-0000-000000856890_w280_r0.6666666666666666_fpx50_fpy33.34.jpg" style="width: 300px;">
                </div>
            </div>
            <div class="box">
                <div>
                    <h2>Falcon 5</h2>
                    <p>Die Falcon 5 war eine geplante Rakete, die auf der Technik der Falcon 1 basieren sollte. Die erste Stufe sollte von fünf Merlin-Triebwerken angetrieben werden und genau wie die erste Stufe der Falcon 1 mit Hilfe von Fallschirmen zur Erde zurückkehren, um wiederverwendet zu werden. Durch den Einsatz von fünf Triebwerken sollte die Falcon 5 auch beim Ausfall eines Triebwerks ihre Mission erfüllen können. Die zweite Stufe wäre von einem modifizierten Merlin-Triebwerk angetrieben worden, das mit einer vergrößerten Ausströmdüse für den Betrieb im fast-Vakuum optimiert war. Die Falcon 5 sollte von Cape Canaveral aus 6.020 kg in eine 200 km hohe Umlaufbahn befördern können, womit sie in der Leistungsklasse der Delta-II Rakete gelegen hätte. Nach der Bekanntgabe der Pläne zur Entwicklung der Falcon 9 änderte SpaceX zunächst die Konfiguration der Falcon 5. Die Falcon 5 sollte aus einer modifizierten Erststufe der Falcon 9 aufgebaut sein und eine Nutzlast von 4.100 kg befördern können. Im Zuge der Entwicklung der Falcon 9 wurde schließlich auf die Falcon 5 verzichtet.</p>
                </div>
                <div>
                    <img src="https://lh3.googleusercontent.com/proxy/9IIQrvGXS4BLvKkdJGJcqyroJJfkcmHCP_ruilNBBs9sE5iFRFkpwjfpZaN3DO3JH6gI3WKcBFslKhQQioL7ZEvR4AuSZ4uxiQQ" style="width: 300px;">
                </div>
            </div>
            <div class="box">
                <div>
                    <h2>Falcon 9</h2>
                    <p>Im Jahr 2006 nahm SpaceX am Wettbewerb der NASA zur privaten Versorgung der ISS, dem Programm Commercial Orbital Transportation Services, teil und war einer der Gewinner. In Zusammenarbeit mit der NASA erfolgte die weitere Entwicklung und Erprobung der Falcon 9. Am 4. Juni 2010 fand der Jungfernflug statt, am 8. Oktober 2012 der erste Flug zur ISS. Neben den Starts der Dragon-Kapseln wird die Falcon 9 auch zum Start von privatwirtschaftlichen und staatlichen Nutzlasten verwendet. SpaceX entwickelte sich damit zu einem direkten Konkurrenten von etablierten Startanbietern wie International Launch Services, Arianespace und der United Launch Alliance.</p>
                </div>
                <div>
                    <img src="https://upload.wikimedia.org/wikipedia/commons/d/df/Iridium-1_Launch_%2832312419215%29.jpg" style="width: 300px; height: 400px;">
                </div>
            </div>
            <div class="box">
                <div>
                    <h2>Wiederverwendbare Raketen</h2>
                    <p>Der Grasshopper und die Falcon 9 Reusable Development Vehicles (F9R Dev) sind experimentelle Raketen für suborbitale Flüge, mit denen erprobt wird, wie eine Raketenstufe nach dem Start kontrolliert gelandet werden kann. Ziel ist es, Raketenkomponenten mehrfach zu verwenden, um Kosten zu minimieren. Die Erkenntnisse flossen in Modifikationen der ersten Stufe tatsächlich eingesetzter Falcon 9 ein, wobei aus Sicherheitsgründen die Landungsversuche zunächst nur über dem Ozean und dann auf dem Autonomous spaceport drone ship (ASDS) erfolgten. Am 21. Dezember 2015 Ortszeit (22. Dezember UTC) beim 20. Start einer Falcon 9 gelang die Rückkehr aus dem All und die sichere Landung am Startplatz Cape Canaveral. Am 8. April 2016 landete im Rahmen der Mission CRS-8 zum ersten Mal eine Erststufe erfolgreich auf dem Autonomous spaceport drone ship. Die erste wiederverwendete Falcon-9-Erststufe wurde am 30. März 2017 gestartet und erfolgreich gelandet.[19] SpaceX arbeitet auch an einer Wiederverwendung der Nutzlastverkleidung.</p>
                </div>
            </div>
            <div class="box">
                <div>
                    <h2>Falcon Heavy</h2>
                    <p>Bereits Mitte der 2000er Jahre plante SpaceX die Entwicklung einer wesentlich stärkeren Rakete mit zwei Boostern. Das Projekt erwies sich als unerwartet komplex und verzögerte sich zusätzlich durch die Explosion einer Falcon 9 im September 2016. Am 6. Februar 2018 erfolgte schließlich mit fünf Jahren Verspätung der Erstflug der Falcon Heavy. Sie besteht aus drei modifizierten Falcon-9-Erststufen mit insgesamt 27 Merlin-Triebwerken sowie einer Falcon-9-Oberstufe. Die Falcon Heavy ist derzeit und bis zur Fertigstellung des Space Launch System (erwartet für frühestens 2021) die weltweit leistungsfähigste verfügbare Trägerrakete. Historisch ist sie die zweitstärkste amerikanische Trägerrakete seit der Mondrakete Saturn V.</p>
                </div>
                <div>
                    <img src="https://upload.wikimedia.org/wikipedia/commons/6/60/Falcon-heavy-crop.jpg" style="width: 300px;">
                </div>
            </div>
            <div class="box">
                <div>
                    <h2>Dragon</h2>
                    <p>Ebenfalls in Eigenregie, jedoch mit NASA-Unterstützung, wurde die Dragon-Kapsel konzipiert, gebaut und erprobt. Am 8. Dezember 2010 startete die erste Dragon-Kapsel auf einer Falcon 9 zu einem Flug ins All und wasserte nach etwa drei Stunden im Pazifischen Ozean.[20] Damit wurde die Fähigkeit demonstriert, die Kapsel auch zu landen. Die Kapsel ist das einzige reine Frachtsystem, das in der Lage ist, größere Nutzlasten von der ISS auch zurück zur Erde zu bringen. Die bisherigen Frachtsysteme (ATV, HTV und Progress) verglühen auf ihrem Rückweg in der Atmosphäre. Im Mai 2012 fand mit der COTS-2-Mission der erste Flug eines Dragon-Raumschiffs zur ISS statt. Der insgesamt neun Tage dauernde Flug beinhaltete zahlreiche Testmanöver. Das Raumschiff transportierte 520 kg Fracht zur ISS und landete mit über 600 kg an nicht mehr benötigten Ausrüstungsgegenständen wieder auf der Erde. Seit Oktober 2012 finden regelmäßige Versorgungsflüge zur ISS statt. Am 28. Juni 2015 stürzte eine Dragon-Kapsel kurz nach dem Start durch die Explosion der Trägerrakete Falcon 9 wegen eines Strebenbruchs ab. Dabei wurden 1,8 Tonnen Fracht für die ISS zerstört. Im Juli 2017 wurde bekannt, dass SpaceX beim Start von CRS-12 zum letzten Mal eine neue Dragon-Kapsel der ersten Generation einsetzen will. Danach soll es nur noch gebrauchte geben, bis man nach dem Ende des aktuellen Frachtauftrages, also nach CRS-20, nur noch Dragon V2 einsetzen will.</p>
                </div>
                <div>
                    <img src="https://static.scientificamerican.com/sciam/cache/file/A0A6A906-C7E5-4A7F-8F20ADBDA02861BE_source.jpg?w=590&h=800&81F1A603-635C-4FB5-B572B844CF40DE0A" style="width: 300px;">
                </div>
            </div>
            <div class="box">
                <div>
                    <h2>Dragon V2</h2>
                    <p>Am 29. Mai 2014 stellte Elon Musk den Prototyp der Dragon V2 (Dragon Version 2) für den Transport von maximal sieben Astronauten vor,[24] das zweite Raumschiff der Dragon-Serie. Das Raumschiff ist mit acht paarweise angeordneten kleinen SuperDraco-Raketentriebwerken ausgestattet und soll damit in der Lage sein, „überall auf dem Land mit der Präzision eines Helikopters zu landen“. Die SuperDraco-Raketentriebwerke verfügen über einen Schub von je 73.000 Newton und werden komplett mit dem 3D-Druckverfahren Lasersintern hergestellt.</p>
                </div>
                <div>
                    <img src="https://i.pinimg.com/originals/dd/62/c6/dd62c673a76ddef4c3132bd27eddd301.jpg" style="width: 300px;">
                </div>
            </div>
            <div class="box">
                <div>
                    <h2>Interplanetary Transport System</h2>
                    <p>Am 27. September 2016 stellte SpaceX-Vorstandschef Elon Musk Pläne für das Interplanetary Transport System (ITS) vor, mit dem erstmals ein bemannter Flug zum Mars ermöglicht werden sollte.[28] Die Arbeiten am dafür benötigten Raketentriebwerk Raptor begannen 2014. Das gesamte ITS-Vehikel sollte eine Höhe von 122 m haben und 300 Tonnen Ladung in den LEO transportieren können, das Raumschiff einen Durchmesser von 17 m aufweisen. Das ITS erwies sich in der geplanten Dimension als nicht finanzierbar. Das Projekt wurde daher weiterentwickelt zur deutlich kleineren und universeller einsetzbaren BFR.</p>
                </div>
            </div>
            <div class="box">
                <div>
                    <h2>Starship und Super Heavy</h2>
                    <p>Am 29. September 2017 stellte SpaceX-Vorstandschef Elon Musk die BFR (Big Falcon Rocket; alternativ auch Big Fucking Rocket) vor, mit der erstmals ein bemannter Flug zum Mars ermöglicht werden soll. Daneben soll sie dazu genutzt werden können, Satelliten in den Orbit zu transportieren und die Internationale Raumstation oder eine mögliche zukünftige Basis auf dem Mond zu versorgen. Prinzipiell soll sie auch in der Lage sein, Passagiere über große Distanzen auf der Erde schnell zu transportieren. Die Unterstufe soll von 31 Raptor-Raketentriebwerken angetrieben werden, und die gesamte BFR soll eine Höhe von über 100 Metern bei einem Durchmesser von neun Metern aufweisen. Die voll wiederverwendbare Variante soll über 100 Tonnen Ladung in niedrige Erdumlaufbahnen transportieren können. Nach mehrfachem Auftanken im Orbit soll die gleiche Masse an Ladung zum Mars transportiert werden können. Die erste Marsmission soll nach Plänen von Musk im Jahr 2022 starten. Zwei Jahre später soll eine erste bemannte Mission folgen, um Vorbereitungen für eine Treibstoffproduktion auf dem Mars zu treffen.[33] Bisherige Zeitplanungen von Musk erwiesen sich meist als zu optimistisch; es kam regelmäßig zu Verzögerungen von mehreren Jahren. Am 17. September 2018 kündigte Musk an, mit der BFR im Jahr 2023 erstmals einen zahlenden Touristen zum Mond und wieder zurückzubringen: den japanischen Milliardär Yusaku Maezawa.</p>
                </div>
            </div>
        </div>
    </section>



This is the CSS:
*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}

nav {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    min-height: 8vh;
    font-family: 'Open Sans', regular;
    background-color: #1c232e;
    color: white;
    box-shadow: 0 4px 4px -4px rgba(0,0,0,.2);
}
.logo {
    color: white;
    font-size: 24px;
}
.nav-links {
    display: flex;
    text-align: center;
    justify-content: space-around;
    width: 30%;
}
.nav-links li {
    list-style: none;
    float: left;
}
.nav-links a {
    color: white;
    text-decoration: none;
    letter-spacing: 2px;
    font-weight: normal;
}
body {
    margin: 0px;
    padding: 0px;
    background-color: white;
    background-image: url(https://g.foolcdn.com/editorial/images/531264/spacex-starshup-with-moon-in-background-is-spacex.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    font-family: 'Open Sans', regular;
    color: black;
}
.main {
    width: 100%;
    padding: 0 100px;
    height: 100vh;
    display: flex;
    justify-content: center;
    margin-top: 50px;
}
.box {
    max-width: 700%;
    position: relative;
    display: flex;
    padding: 50px;
    background: rgba(255,255,255,.2);
    box-shadow: 0 5px 15px rgba(0,0,0,.5);
    margin-bottom: 30px;
    align-items: center;
}
.box h2 {
    margin: 0 0 20px;
    padding: 0px;
    font-size: 30px;
    text-transform: uppercase;
}
.box p {
    margin-top: 10px;
    margin-right: 20px;
}
.heading {
    width: 100%;
    height: 300px;
    display: flex;
    background-image: url(https://www.ecopetit.cat/wpic/mpic/59-591365_1-29-falcon-heavy-falcon-spacex-falcon-heavy.jpg);
    background-size: cover;
    background-position: 50% 20%;
    align-items: center;
    text-align: center;
    justify-content: center;
}
.heading h1 {
    color: white;
    font-size: 40px;
    letter-spacing: 5px;
}



Is This A Good Question/Topic? 0
  • +

Replies To: I got a little problem with my background image

#2 Splashsky   User is offline

  • D.I.C Addict
  • member icon

Reputation: 9
  • View blog
  • Posts: 565
  • Joined: 25-August 13

Re: I got a little problem with my background image

Posted 25 April 2020 - 07:48 AM

What do you mean a bit of your background is "popping up"? I see a fixed background image, but that's about it.
Was This Post Helpful? 0
  • +
  • -

#3 danchy22   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 29
  • Joined: 27-April 20

Re: I got a little problem with my background image

Posted 27 April 2020 - 01:27 PM

^^ Have you got a SS or something of what is popping up?
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1