problema allineamento verticale testo

**F.Bandiera** · 31-07-2007, 12:16

Ciao a tutti, ho un problema con l'allineamento verticale del testo di una barra menu.

In pratica ho un menu con i testi di alcuni pulsanti che devono essere scritti su due righe e voglio che quelli che invece occupano una riga sola siano allineati verticalmente in basso.

Vi scrivo come è strutturato e posto il codice, please, help me!

div navbar [width definita, height no (posso anche spec se serve)]
ul [margin e padding messi a 0]
li [width specificata, height no (idem come sopra), resi float left]

il testo dei pulsanti del menu è contenuto nei[*] e va dal..... al:
- come arrivare [disporre su due righe]
- milonga [una sola righa, ma la vorrei allineata in basso con la secondo riga del [*] precedente]

Codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

css:
ul {margin: 0px; padding: 0px;}
#navbar {width: 625px;}
#navbar ul li {width: 77px; float: left;}

html:
<div id="navbar">
<ul>
[*]buskers Festival[*]
milonga[*]anteprima ed eventi[/list]
</div>

Grazie 10000 a chiunque mi vorrà aiutare!!!!!

**fcaldera** · 31-07-2007, 12:38

aggiungendo una marcatura dentro[*] (ad esempio un tag <a> visto che si tratta di un menu) e definendo la loro altezza (in ems così funziona anche ridimensionando un paio di volte il font)

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="it" xml:lang="it">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <title>xhtml 1.0</title>
        
        <style type="text/css">
            ul {
                list-style-type: none;
                margin  : 0px; 
                padding : 0px; 
                height  : auto;
                overflow: hidden;
            }
            #navbar {
                width   : 625px;
            }
            
            #navbar ul li {
                width       : 77px;
                padding     : 0;
                font-size   : 1em;
                height      : 3em;
                float       : left; 
                display     : inline;
                position    : relative;
            }
            
            #navbar li a {
                
                position: absolute;
                bottom  : 0;
            }
        </style>
        
    </head>

<body>


<div id="navbar">
<ul>
<!-- cerca un modo di allineare in basso, senza usare il 
 !-->[*]buskers Festival[*]milonga[*]anteprima ed eventi[/list]
</div>

</body>
</html>

Discussione: problema allineamento verticale testo

Strumenti discussione

Ricerca discussione

Visualizza

problema allineamento verticale testo

Permessi di invio