• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Html Menüleiste oben mittig

P

Püppi

Neues Mitglied
Hey,

bin noch ziemlicher Anfänger im umgang mit HTML ...
Bin gerade dabei eine kleine homepage zu basteln allerdings bekomme ich es nicht hin die Navigationsleiste oben mittig zum Rest zu setzen.
Kann mir da jemand helfen?
Meine Seite sieht bisher so aus:



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> Testseite2 </title>

<link rel="stylesheet" type="text/css" href="ss_testseite2.css" />
</head>

<body>

<br /> <br /> <br />
<div align="center">
<ul id="navi">
<li><a href="#">Home</a></li>
<li><a href="#">Wohnen</a>
<ul>
<li><a href="#">Sofas</a></li>
<li><a href="#">Sessel</a></li>
<li><a href="#">Tische</a></li>
<li><a href="#">Schr&auml;nke</a></li>
<li><a href="#">Regal</a></li>
<li><a href="#">Teppiche</a></li>
</ul>
</li>
<li><a href="#">Essen</a>
<ul>
<li><a href="#">Tische</a></li>
<li><a href="#">St&uuml;hle</a></li>
<li><a href="#">Geschirr</a></li>
<li><a href="#">Schr&auml;nke</a></li>
<li><a href="#">Regale</a></li>
<li><a href="#">Ger&auml;te</a></li>
</ul>
</li>
<li><a href="#">Schlafen</a>
<ul>
<li><a href="#">Betten</a></li>
<li><a href="#">Bettw&auml;sche</a></li>
<li><a href="#">Regale</a></li>
<li><a href="#">Schr&auml;nke</a></li>
<li><a href="#">Tische</a></li>
</ul>
</li>
<li><a href="#">Kinder</a>
<ul>
<li><a href="#">Betten</a></li>
<li><a href="#">Bettw&auml;sche</a></li>
<li><a href="#">Schränke</a></li>
<li><a href="#">Tische</a></li>
</ul>
</li>
<li><a href="#">Bad</a>
<ul>
<li><a href="#">Armaturen</a></li>
<li><a href="#">Badewannen/Whirlpools</a></li>
<li><a href="#">Schr&auml;nke</a></li>
<li><a href="#">Dusche</a></li>
<li><a href="#">WCs</a></li>
<li><a href="#">Spiegel</a></li>
<li><a href="#">Handtücher</a></li>
</ul>
</li>
<li><a href="#">Dekoration</a></li>
</ul>

</body>
</html>



Vielen Dank im voraus.
 
also erstmal wäre es schön, wenn du die HTML-tags benutzen könntest :-o

zu deiner frage:
um die navi oben mittig anzuordnen, musst du die listeneinträge nebeneinander floaten und die gesamte liste dann in der mitte platzieren... mit css dann natürlich.

HTML: 
<style>
    #navigation li {float:left; }
    #navigation {width:600px; margin: 0 auto; }
</style>
<!-- zwischencode ausgelassen -->
<div id="navigation">
    <ul>
        <li>item 1</li>
        <li>item 2</li>
        <li>item 3</li>
    </ul>
</div>
 
Ich hab jetzt ein komplett anderes Dropout menü gemacht.
Mein problem ist aber jetzt, dass sich das Bild unter dem Menü verschiebt sobald man es öffnet. wie kann ich das beheben ? Bitte wenn möglich easy erklären :D
 
sry wenn ich jetzt ein bisschen platt wirke, aber könntest du vllt nen link zu der site geben? denn kann man sich das mal genauer anschauen...

also ich würde es jetzt so verstehen, du hast unterhalb deiner nav ein bild und wenn des dropdown geöffnet wird, wird das bild nach unten verschoben... dabei müsste ich ganz ehrlich sein, dass ich ein solches problem noch nie selbst hatte... aber wie gesagt, link bzw. anschauungsmaterial wäre sehr hilfreich :)
 
Die HP ist ja noch nicht online .. oder muss sie das gar nicht sein ?
Kannst du mir vielleicht noch erklären wie man Text auf ein Bild macht? Habe div boxen gemacht, in denen bilder sind 2 oben und 2 unten. Und auf die möchte ich jeweils ein Wort schreiben, wenn das einfach geht wäre meine nächste Schwierigkeitsstufe, dass die Wörter nur erscheinen wenn man über das Bild fährt. Ist das überhaupt möglich ?
Sorry für die vielen Fragen :D
 
Zuletzt bearbeitet:
Püppi schrieb:
Sorry für die vielen Fragen :D
Zum Vergrößern anklicken....

kein problem. dafür sind wir ja hier :mrgreen:

also wenn du die seite zeigen willst muss sie für andere zugänglich sein... ergo muss sie in dem fall hochgeladen werden...

um bilder auf einem bild anzuzeigen, könntest du die bilder als backgrounds machen für die divs und den text dann einfach in die divs schreiben

eine andere möglichkeit (mit der ich selbst aber noch nicht viel gearbeitet habe und deshalb nicht sehr viel dazu sagen kann) ist, dass du mit dem z-index arbeitest... also du packst das bild, auf dem der text stehen soll, bsp auf den z-index 1 und den div mit dem text auf den z-index 2... dazu dann noch ein hover-effekt und voila!

ich denke jedoch selbst, dass ich leichter gesagt als getan... aber wie gesagt: mit dem z-index habe ich selbst noch nicht viel gearbeitet und kann dir auch keinen beispiel code geben... sry :sad:
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben