Divi normalnie się wyświetlają ,ale footer i inne divi poza headerem pokazuje pod nagłówkiem

pytanie zadane 19 maja 2017 w HTML i CSS przez YeahBunny Nowicjusz (140 p.)

Witam, tak jak w temacie .

Kod CSS:

body {
    margin: 0 !important;
}

header {
    width: 100%;
    height: 90%;
    background-color: blue;
    font-family: 'Open Sans', sans-serif;
    font-size: 75px;
}

#container {
    font-family: 'Lato', sans-serif;
    text-align: justify;
    margin-left: 50px;
    font-size: 25px;
    margin-right: 50px;
    float: left;
    height: auto;
    width: 95%;
    float: center;

}

#container h1 {
    font-size: 50px;
    margin-left: 50px;
    padding-bottom: 25px;

}

header p {
    margin: 0;
    line-height: 5;
}

nav {
    width: auto;
    height: 85px;
    background-color: #404040;
    font-family: 'Montserrat', sans-serif;
    font-size: 40px;
    color: #1883ff;
    margin-top: 0;
    line-height: 2;
    padding-left: 10px;
}

#navbar {
    color: #1883ff;
    float: right;
    width: auto;
    height: 85px;
    font-family: 'Lato', sans-serif;
    font-size: 40px;
    line-height: 2;
    margin-left: 5px;
    text-decoration: none;
    padding-right: 10px;
}

#navbar:hover, #navbar:focus {
    color: white;
}

#footer {
    width: auto;
    height: 35px;
    margin-top: 50px;
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    font-size: 30px;
}

Kod HTML

<!DOCTYPE html>

<html>
    <head>
        <title>Elementalist App</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="initial-scale=1.0">
        <link rel="stylesheet" type="text/css" href="css/style.css">
        <link href="https://fonts.googleapis.com/css?family=Baloo|Lato|Montserrat|Open+Sans" rel="stylesheet">
    </head>

    <body>
        <header>
            <nav>
                    aawdawdawdwadwadawdawd

                    <a href="">
                        <div id="navbar">
                        Kontakt
                        </div>
                    </a>
                    <a href="">
                       <div id="navbar">
                       Usługi
                        </div>
                    </a>
                    <a href="">
                       <div id="navbar">
                        Projekty
                        </div>
                    </a>
                    <a href="">
                       <div id="navbar">
                         O nas
                        </div>
                    </a>
            </nav>
            <div class="head">
                 <center>
                     <p>Coś tam coś tam</p>
                </center>

            </div>

        </header>
        <div id="container">

            <div id="selection">
                <h1>O nas</h1>
                aawdawdawdwadwadawdawd
            </div>

            <div id="selection">
                <h1>Projekty</h1>
                aawdawdawdwadwadawdawd
            </div>

            <div id="selection">
                <h1>Narazie tutaj nic nie będzie</h1>
                Lorem ipsum iksde jeden dwa trzy heheheh
            </div>
            <div id="selection">
                <h1>Kontakt</h1>
               aawdawdawdwadwadawdawd

            </div>
            <div style="clear:both"></div>
        </div>

        <div id="footer">
        aawdawdawdwadwadawdawd

        </div>

    </body>
</html>

1	komentarz 19 maja 2017 przez ScriptyChris Mędrzec (190,190 p.) Wstaw proszę kod w odpowiednie bloczki.

1 odpowiedź

odpowiedź 19 maja 2017 przez ProgramistaStepek Nałogowiec (27,020 p.)

Po pierwsze to element o danym ID powinien być tylko jeden na stronie, a nie tak jak u ciebie


                        <div id="navbar">
                        Kontakt
                        </div>
             
                       <div id="navbar">
                       Usługi
                        </div>

komentarz 19 maja 2017 przez pablop76 VIP (123,180 p.)

Witam. Jak już napisał ProgramistaStepek poczytaj do czego i kiedy stosuje się id a do czego klasy. Co i tak nie będzie miało wpływu na ułożenie Twoich elementów na stronie. Układają się tak jak je zakodowałeś. Więc nie wiem czego oczekujesz?

co czyści ten div ?