Horizontale Navigation

[Alti]

Gibt es eine Möglichkeit eine horizontale Navigation ohne Listenelemente (ul,li) darzustellen?
Anlass ist folgender:
Habe HTML+CSS von $kunde erhalten und soll nun die CSS umschreiben, sodass ein neues Theme entsteht, die HTML jedoch nicht ändern.
Die Links sind in einem DIV und jeder Link ist von einem Span umfasst.
Denke die Infos sollten reichen.

MFG
Alti

 

[matibaski]

Evtl. Codes oder Link?
Aus dem Kopf kann ich nicht wissen wie es bis jetzt steht.


MfG, matibaski

 

[Alti]

Die HTML

<div class="header_links">
                <form method="get" enctype="multipart/form-data" action="index.php">
                            <span><a href="/XXX" class="nav" name="home">XXX</a></span><span class="linkseperator"> - </span><span>
    </form>
###Relevanter Ausschnitt, Alle Links sehen so aus, außerdem gibt es noch ein Suchfeld, was aber nicht relevant sein dürfte. 
       </div>

Die CSS

.header_links {
    float: left;
    width: 12%;
    padding-top: 0px;
    margin-bottom: 50px;
}
span.header_links {
    float:left;
    display:inline;
    width:11%;
}

So klappt es aber nicht.

 

[matibaski]

Ich kann da mal bei dem Code nicht verstehen, wieso der form-Tags benutzt.
Nunja, egal....

Ich würde gerne wissen, woran das Problem liegen soll.

Habe HTML+CSS von $kunde erhalten und soll nun die CSS umschreiben, sodass ein neues Theme entsteht, die HTML jedoch nicht ändern.

Wie meinst du Theme?
So 'ne Art DropDown oder wie?

Denn ich seh einfach einen Link in einem Form-Feld der Formatier wurde.

MfG, matibaski

 

[Alti]

Es geht darum wie ich speziell diese Links horizontal darstellen kann...
Das Formular ist wegen dem Suchbutton da.

 

[Commodore]

Also ich verstehe überhaupt nicht, was du meinst...


Ich verstehe es soweit, dass du alle Links nebeneinander darstellen willst. Aber was du da plötzlich mit Listen willst...

 

[Alti]

http://css.maxdesign.com.au/listamatic/horizontal01.htm
Ich kenne halt nur diese Möglichkeit und diese benutzt eine Liste.
So und dann wieder zur Anfangsfrage: Gibt es eine andere Möglichkeit Links die in Spans umfasst sind horizontal darzustellen?

 

[Commodore]

<div class="header_links">
<span><a href="seite.html" class="nav" name="home">XXX</a></span><span class="linkseperator"> - </span>
<span><a href="andereseite.html" class="nav" name="home">XXX</a></span><span class="linkseperator"> - </span>
</div>

Das sind Links, die horizontal dargestellt sind.

Oder meinst du vertikal?

 

[Alti]

Ich glaub du verwechselst da grad was:
Horizontal:

-XXX----XXX-------XXX------XXX----XXX----XXX----------

Vertikal:

XXX
XXX
XXX
XXX

 

[prostel]

Ich glaube er verwechselt da nichts.
Erhöhe mal die width in der header_links Klasse.
Dann sind die Links bei mir nebeneinander

<style>
.header_links {
    float: left;
    width: 100%;
    padding-top: 0px;
    margin-bottom: 50px;
}
span.header_links {
    float:left;
    display:inline;
    width:11%;
}
</style>
<div class="header_links">
  <form method="get" enctype="multipart/form-data" action="index.php">
    <span><a href="/XXX" class="nav" name="home">XXX</a></span><span class="linkseperator"> - </span>
    <span><a href="/XXX" class="nav" name="home">XXX</a></span><span class="linkseperator"> - </span>
    <span><a href="/XXX" class="nav" name="home">XXX</a></span><span class="linkseperator"> - </span>
    <span><a href="/XXX" class="nav" name="home">XXX</a></span><span class="linkseperator"> - </span>
  </form>
  ###Relevanter Ausschnitt, Alle Links sehen so aus, außerdem gibt es noch ein Suchfeld, was aber nicht relevant sein dürfte. 
</div>

 

[Alti]

Ah Ok, diesmal war es mein Fehler. Da lag noch ne Klasse um die andere Klasse drum, die ein falsches Display drin hatte. Also war es diesmal zu wenig relevanter Code
trotzdem Danke

 

[blax]

Ah Ok, diesmal war es mein Fehler. Da lag noch ne Klasse um die andere Klasse drum, die ein falsches Display drin hatte. Also war es diesmal zu wenig relevanter Code
trotzdem Danke

Ich glaube nicht, dass "span.header_links" existiert, damit änderst du mal garnix!
Die Span`s haben doch die Klasse nav, du müsstest also entweder ".header_links span" nutzen um die spans zu ändern.

 

[Alti]

Ich glaube nicht, dass "span.header_links" existiert, damit änderst du mal garnix!
Die Span`s haben doch die Klasse nav, du müsstest also entweder ".header_links span" nutzen um die spans zu ändern.

Naja, das Problem ist gelöst.

Bei Klassen schreibt man doch den Tag getrennt durch einen Punkt vor die Klasse.