Menù

Demo

  • una linea
  • una linea
  • due
    linee
  • una linea
  • due
    linee
  • una linea
  • una linea
  • tre
    linee
    3
  • aggiornato il 12/03/2025 14:04:16

Top 5

Liste affiancate con la stessa altezza

Assegno l'altezza dell'elemento più alto all'elemento affiancato dell'altra lista.

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>
    $(document).ready(function(){
        $(".prima li").each(function(k){
            if($(this).height() >= $(".seconda li").eq(k).height())
                $(".seconda li").eq(k).height($(this).height());
            else
                $(this).height($(".seconda li").eq(k).height());
        });
    });
</script>
<style>
    ul.liste_allineate {
        margin:0;
        padding:0;
        list-style-type: none;
        float:left;
    }
    ul.liste_allineate li {
        padding:8px;
        border:1px solid black;
        margin:1px 0;
    }
</style>
<ul class="liste_allineate prima">
    <li>una linea</li>
    <li>una linea</li>
    <li>due <br/>linee</li>
    <li>una linea</li>
</ul>
<ul class="liste_allineate seconda">
    <li>due <br/>linee</li>
    <li>una linea</li>
    <li>una linea</li>
    <li>tre <br/>linee <br/> 3</li>
</ul>

criric

Mi sono appassionato di programmazione web a 34 anni, un pò tardi, da allora però non perdo mai occasione per imparare qualcosa di nuovo in questi campi.

Javascript - Html - Css - Php - Mysql

Inserisci un commento

Codice antispam

Categorie

Comunicazioni

Puoi utilizzare questo modulo per qualsiati tipo di segnalazione.

Codice antispam

 

I dati di questo modulo non verranno pubblicati.