navigation mit vielen Listenpunkten

[bibifellow]

Hallo ich habe eine Navigation mit 15 Listenpunkten, die alle horizontal angeordnet sind. Mit welchem Befehl kann ich den Zeilenumbruch der Zeilen steuern, da er sonst in die 1. Zeile 6 Menüpunkte dann verschoben 2 in die 2. Zeile und der Rest links in die 3. Zeile.

Galerie 1 Galerie 2 Galerie 3 Galerie 4
Galerie 5
Galerie 6 Galerie 7

so sieht das dann aus.

 

[msblacky]

Hallo,

also ich finde schon mal 15 Punkte für eine horizontale Navi zuviel, aber man sollte auch mal Deinen Code sehen können damit man hier weiter was dazu sagen kann, wäre gut wenn Du den mal posten könntest.

msblacky

 

[Talirion]

ich weiß nicht ob es dir hilft aber meinst du sowas in der art?
https://jqueryui.com/sortable/#display-grid

 

[bibifellow]

<nav>
                        <ul id="navMain">
   <!-- <li><a href="index.php" >Home</a></li>-->

                               <li ><a href="galerie.php?seite=gallerie1"
   class="normal"tabindex="1" >  Gallerie 1</a>
  
  
   
                            <li><a href="galerie.php?seite= gallerie2"
   class="normal"tabindex="1" > gallerie 2</a></li>
                            <li><a href="galerie.php?seite= gallerie3"
   class="normal"tabindex="1" > gallerie 3</a></li>                           
                          <li><a href="galerie.php?seite= gallerie4"
   class="normal"tabindex="1" > gallerie 4</a></li>  
                            <li><a href="galerie.php?seite= gallerie5"
   class="normal"tabindex="1" > gallerie 5</a></li>
  
         <li><a href="galerie.php?seite= gallerie6"
   class="normal"tabindex="1" > gallerie 6</a></li>
  
                            <li><a href="galerie.php?seite= gallerie7"
   class="normal"tabindex="1" > gallerie 7</a></li>
  
                            <li><a href="galerie.php?seite= gallerie8"
   class="normal"tabindex="1" > gallerie 8</a></li>
  
                            <li><a href="galerie.php?seite= gallerie9"
   class="normal"tabindex="1" > gallerie 9</a></li>
  
                            <li><a href="galerie.php?seite= gallerie10"
   class="normal"tabindex="1" > gallerie 10</a></li>
  
                            <li><a href="galerie.php?seite= gallerie11"
   class="normal"tabindex="1" gallerie 11</a></li>
  
                            <li><a href="galerie.php?seite= gallerie12"
   class="normal"tabindex="1" > gallerie 12</a></li>
  
                           
                            <li><a href="galerie.php?seite= gallerie13"
   class="normal"tabindex="1" > gallerie 13</a></li>
  
                            <li><a href="galerie.php?seite= gallerie 14"
   class="normal"tabindex="1" > gallerie 14</a></li>
  
                            <li><a href="galerie.php?seite= gallerie15"
   class="normal"tabindex="1" > gallerie 15</a></li>
  

                        </ul>
                    </nav>

 

[Myhar]

Kurze Anmerkung: Es heißt Galerie (wie von dir im 1. Post richtig geschrieben) und nicht gallerie. class="normal" brauchst du auch nicht am Linkelement, wenn jedes Linkelement in der Liste gleich gestyled werden soll. Auch ist tabindex="1" unsinnig.
Zu deinem eigentlichen Problem: Mit CSS3 Selektoren kannst du gezielt das n-te Element ansprechen.

 

[Talirion]

also ich denke du meinst es so:

http://jsfiddle.net/7Pmvq/1/

<style>
    #navMain {
        list-style-type: none;
        margin: 0;
        padding: 0;
        width: 450px;
    }
    #navMain li {
        margin: 3px 3px 3px 0;
        padding: 1px;
        float: left;
        width: 100px;
        height: 25px;
        font-size: 1em;
        text-align: center;
        background-color: #bbb;
    }
</style>
<ul id="navMain">
    <!-- <li><a href="index.php" >Home</a></li>-->
    <li><a href="galerie.php?seite=gallerie1" class="normal" tabindex="1">  Gallerie 1</a>

        <li><a href="galerie.php?seite= gallerie2" class="normal" tabindex="1"> gallerie 2</a>

        </li>
        <li><a href="galerie.php?seite= gallerie3" class="normal" tabindex="1"> gallerie 3</a>

        </li>
        <li><a href="galerie.php?seite= gallerie4" class="normal" tabindex="1"> gallerie 4</a>

        </li>
        <li><a href="galerie.php?seite= gallerie5" class="normal" tabindex="1"> gallerie 5</a>

        </li>
        <li><a href="galerie.php?seite= gallerie6" class="normal" tabindex="1"> gallerie 6</a>

        </li>
        <li><a href="galerie.php?seite= gallerie7" class="normal" tabindex="1"> gallerie 7</a>

        </li>
        <li><a href="galerie.php?seite= gallerie8" class="normal" tabindex="1"> gallerie 8</a>

        </li>
        <li><a href="galerie.php?seite= gallerie9" class="normal" tabindex="1"> gallerie 9</a>

        </li>
        <li><a href="galerie.php?seite= gallerie10" class="normal" tabindex="1"> gallerie 10</a>

        </li>
        <li><a href="galerie.php?seite= gallerie11" class="normal" tabindex="1"> gallerie 11</a>

        </li>
        <li><a href="galerie.php?seite= gallerie12" class="normal" tabindex="1"> gallerie 12</a>

        </li>
        <li><a href="galerie.php?seite= gallerie13" class="normal" tabindex="1"> gallerie 13</a>

        </li>
        <li><a href="galerie.php?seite= gallerie 14" class="normal" tabindex="1"> gallerie 14</a>

        </li>
        <li><a href="galerie.php?seite= gallerie15" class="normal" tabindex="1"> gallerie 15</a>

        </li>
</ul>
</nav>