Visualizzazione dei risultati da 1 a 3 su 3

Visualizzazione discussione

  1. #1

    Bordi delle celle tabella con scroll bar interna

    Buongiorno,
    è un piacere essere inscritto in questo interessante forum di HTML.it. Ho un piccolo forse anche stupido problema allora dato il seguente codice HTML:

    codice:
    <html>
    <head>
    <link href="tabella.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
     
    <table class="tbext">
        <thead class="testa">
            <tr>
                <th class="col1">Prev. N.</th>
                <th class="col2">Cliente</th>
                <th class="col3">Telefono</th>
                <th class="col4">Veicolo</th>
                <th class="col5">Prev. Consegna</th>
                <th class="col6">Stato</th>
                <th class="col7">Priorit&agrave;</th>
                <th class="col8"> </th> 
            </tr>
        </thead> 
        <tbody>
            <tr>
                <td colspan="8">
            <div class="scrollit">
                <table class="tbint">
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                    <tr>
                        <td>January</td>
                        <td>$100</td>
                    </tr>
                    <tr>
                        <td>February</td>
                        <td>$80</td>
                    </tr>
                </table>
            </div>
                    </td>
            </tr>
        </tbody>
    </table>
    <body>
    </html>
    e il suo relativo CSS:

    codice:
    .tbext{
        border-collapse: collapse; 
        width:100%;
        padding:0px;
        margin:0px;
        border: 1px solid #666666;
    }
    
    
    .tbint tr{
        height: 18px; 
        border-color: green;
          
    }
    
    
    tbody div{
        overflow-y:scroll;
        height:130px;
        border: none;
        width: 100%;
        overflow-x: hidden;
    }
     
    .testa{
        font-family: Arial;
        font-size: 9pt;
        font-weight: bold;
        color: #FFFFFF;
        background-image: url(grigio_scuro.png);
        background-repeat: repeat-x;
        height:22px;
        border-color:#666666;
        border: 1px solid #666666;
        padding:0px;
        margin:0px;
    }
    
    
    .col1{
        width: 2%;
        border-color:#666666;
        border: 1px solid #666666;
        border-right: none;
    }
    .col2{
        width: 8%; 
        border-color:#666666;
        border: 1px solid #666666;
        border-right: none;
        border-left: none;
    }
    .col3{
        width: 5%; 
        border-color:#666666;
        border: 1px solid #666666;
        border-right: none;
        border-left: none;
    }
    .col4{
        width: 8%; 
        border-color:#666666;
        border: 1px solid #666666;
        border-right: none;
        border-left: none;
    }
    .col5{
        width: 4%; 
        border-color:#666666;
        border: 1px solid #666666;
        border-right: none;
        border-left: none;
    }
    .col6{
        width: 8%; 
        border-color:#666666;
        border: 1px solid #666666;
        border-right: none;
        border-left: none;
    }
    .col7{
        width: 4%; 
        border-color:#666666;
        border: 1px solid #666666;
        border-right: none;
        border-left: none;
    }
    .col8{
        width: 4%; 
        border-color:#666666;
        border: 1px solid #666666;
        border-right: none;
        border-left: none;
    }
    Ottengo una tabella di questo tipo come nella seguente immagine:

    Tabella Problema.jpg

    Perchè non riesco a visualizzare i bordi delle celle?
    Chiaramente l'ultima colonna non si devono vedere i bordi delle celle a patto di quella sinistra (border-left). Lì ci andranno i pulsanti in formato immagine.
    Potreste cortesemente aiutarmi a capire dove sta il problema e dove posso far si che il bordo di 0.5pt o 0.5px sia visibile per tutte le celle a meno dell'ultima colonna come già detto sopra.
    Grazie
    Cordialmente
    Cristian Capannini
    Immagini allegate Immagini allegate
    Ultima modifica di criscap1985; 29-10-2015 a 10:52 Motivo: Immagine sbagliata

Tag per questa discussione

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.