Jakob: Margin in Display: Inline

Beitrag lesen

Hey, ich bin Anfänger aslo net böse sein ... ich würde ekine im heder die navigation haben aber nicht mit dem fußanfang gleichbündig. ich hatte es mit margin bei div menu probiert aber ich denke das bei display:inline margin net mehr geht [macht auch sinn]. Wie mache ich dann

Die farben von den bereichen ist zur hilfe das fertige design wir besser ;)

Bitte um hilfe

HTML :

<!DOCTYPE html>
<html>

  <head>
     <title>Homewoker - mach was du kannst</title>
     <link rel="stylesheet" href="style.css" type="text/css">
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <link href="https://fonts.googleapis.com/css?family=Open+Sans:300:800" rel="stylesheet">
  </head>

  <body>
    <div class="site">

      <header>
        <div class="header">
          <h1>HomeWorker<h1>

            <div class="menu">
              <p>Fächer</p>
              <p>Kontakt</p>
              <p>Impressum</p>
            </div>

        </div>


      </header>

      <section></section>
      <footer></footer>

    </div>
 </body>

</html>

CSS :

*{
    margin: 0;
    padding: 0;
}

.site {
  width: auto;
  margin-left: auto;
  margin-right: auto;
  font-family: "Open Sans";
}

header{
  width: auto;
  height: 50px;
  background-color: lightgreen;
}

.header{
  width: 1000px;
  height: 50px;
  background-color: green;
  margin-left: auto;
  margin-right: auto;

}

.header h1 {
  color: white;
  display: inline;
}

.header p {
  color: grey;
  display: inline;
  margin-left: 3px;
  margin-right: 3px;
  font-size: 20px;
}

.menu {
  display: inline;
  margin-left: 30px;
  margin-top: -15px;
}

section{
  height: 1000px;
  background-color: lightblue;
}

footer {
  height: 50px;
  background-color: lightgrey;
}

akzeptierte Antworten