Wie kann man ein festes Bild über einem div oder header in css anzeigen lassen ohne, dass es sich in diesem Container befindet?

1 Antwort

Mit Flexbox ist das kein großes Problem:

HTML

<header class="header">
  <div class="logo">
    <img src="http://via.placeholder.com/80x80" alt="Logo">
  </div>
  <nav class="menu">
    <ul>
      <li>Link</li>
      <li>Link</li>
      <li>Link</li>
      <li>Link</li>
    </ul>
  </nav>
</header>

CSS

.header {
  display: flex;
  height: 80px;
}

.header .menu {
  display: flex;
  flex-grow: 1;
  justify-content: center;
  align-items: center;
}

.header .menu ul {
  display: flex;
  margin: 0;
  padding: 0;
}
.header .menu ul li {
  list-style: none;
  padding: 0 20px;
}

Beispiel

https://jsfiddle.net/Babelfisch/kxz2suac/

Woher ich das weiß:Berufserfahrung – Entwickle Webseiten seit über 25 Jahren.

Grafix343 
Beitragsersteller
 18.03.2023, 16:09

Hey, ich weiß leider nicht wie man die "nav", "ul" und "li" tags benutzt kann man das ganze auch mit dem "a" tag machen?

Babelfish  18.03.2023, 16:28
@Grafix343

Deine Links musst du natürlich noch mit dem A-Tag in den LI einfügen. Wie der Rest verwendet wird, siehst du in meinem Beispiel und kannst du in jeder HTML5-Doku nachlesen.