Span o ul

**natale.ribene** · 18-01-2012, 14:52

Salve. Cosa è meglio utilizzare per i menu orizzontali ?

span oppure ul e li ?

grazie.

**Myaku** · 18-01-2012, 15:50

Originariamente inviato da natale.ribene
ul e li

a prescindere da come lo presenti graficamente, un menu è una lista.

**gcarless** · 18-01-2012, 17:56

Concordo anch'io.

Logicamente un menù è una lista.

**natale.ribene** · 20-01-2012, 15:53

Sarà ma io non ci riesco.

Se uso lo span riesco a creare per ogni <a> un rettangolo ma non riesco a distanziarli tra loro.

Se unvece uso ul e li le ancore si dispongono verticalmente e non rimangono all'interno del div creato apposta (lo stesso div che utilizzo con lo span.

Come mai ?

Avete un esempio ?

Grazie.

**Myaku** · 20-01-2012, 16:37

Originariamente inviato da natale.ribene
Se uso lo span riesco a creare per ogni <a> un rettangolo ma non riesco a distanziarli tra loro.

perchè lo span è un elemento di tipo inline

Se unvece uso ul e li le ancore si dispongono verticalmente

perchè sono elementi di tipo blocco

edit: vuoi approfondire?

e non rimangono all'interno del div creato apposta (lo stesso div che utilizzo con lo span.

Come mai ?

per questo, senza codice è un tantino difficile dirti perchè il div collassa.

Avete un esempio ?

cssplay.co.uk
c'è un'intera sezione dedicata ai menu (un esempio: http://www.cssplay.co.uk/menus/pro_horizontal.html)

**carlomarangoni** · 20-01-2012, 23:40

codice:

<!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>
                <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
                <title></title>
<style type="text/css">
<!--
body {
        margin:0;
        padding:0;
        font: bold 11px/1.5em Verdana;
}

h2 {
        font: bold 14px Verdana, Arial, Helvetica, sans-serif;
        color: #000;
        margin: 0px;
        padding: 0px 0px 0px 15px;
}

img {
border: none;
}
#tabs8 {
      float:left;
      width:100%;
      background:#FCF1F6;
      font-size:93%;
      line-height:normal;
          border-bottom:1px solid #E276A7;
      }
    #tabs8 ul {
          margin:0;
          padding:10px 10px 0 50px;
          list-style:none;
      }
    #tabs8 li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabs8 a {
      float:left;
      background:url("tableft8.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
    #tabs8 a span {
      float:left;
      display:block;
      background:url("tabright8.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#333;
      }
    #tabs8 a span {float:none;}
    #tabs8 a:hover span {
      color:#591333;
      }
    #tabs8 a:hover {
      background-position:0% -42px;
      }
    #tabs8 a:hover span {
      background-position:100% -42px;
      }

      #tabs8 #current a {
              background-position:0% -42px;
      }
      #tabs8 #current a span {
              background-position:100% -42px;
      }
-->
</style>
        </head>

        <body>
                <div id="tabs8">
                        <ul>
<li id="current"><span>Home</span>[*]<span>Products</span>[*]<span>Services</span>[*]<span>Support</span>[*]<span>Order</span>[*]<span>News</span>[*]<span>About</span>[/list]
                </div>
        </body>
</html>

Discussione: Span o ul

Strumenti discussione

Ricerca discussione

Visualizza

Span o ul

Re: Span o ul

Qualcosa non và

Re: Qualcosa non và

Permessi di invio