[Risolto] [CSS] Stesso width di th e td di due tabelle diffe

Linguaggi di programmazione: php, perl, python, C, bash, ecc.

[Risolto] [CSS] Stesso width di th e td di due tabelle diffe

Messaggioda TommyB1992 » lunedì 15 maggio 2017, 21:39

Codice: Seleziona tutto
<!DOCTYPE html><html><head>
<style>
 * {
    margin: 0;
    padding: 0;
    font-family: "Segoe UI", Arial, sans-serif;
}
table{
  width:100%;

}
.tbl-header{
  background-color: #fff;
  background-color: #f5f5f6

 }
.tbl-content{
  height:300px;
  overflow-x:auto;
  margin-top: 0px;

}
th{   

  font-weight: bold;
  text-align: left;
  font-size: 12px;
  color: #949494;;
  text-transform: uppercase;
  width: 20px;
  padding:10px;
  border-right: 1px solid #ebebeb;
}
td{

  text-align: left;
  font-size: 12px;
  color: #fff;
  color: #949494;;
  border-bottom: 1px solid #ebebeb;
  border-right: 1px solid #ebebeb;
  width: 10px;
  padding:10px;
}
::-webkit-scrollbar {
    width: 6px;
}
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
</style>
</head><body>

  <div class="tbl-header">
    <table>
      <thead>
        <tr>
          <th>a</th>
          <th>b</th>
          <th>c</th>
          <th>d</th>
          <th>e</th>
        </tr>
      </thead>
    </table>
  </div>
  <div class="tbl-content">
    <table>
      <tbody>
        <tr>
          <td>dassd</td>
          <td>2123123 </td>
          <td>12231</td>
          <td>asdasdd</td>
          <td>sdaasd21323</td>
        </tr>
      </tbody>
    </table>
  </div>

</body></html>


Se salvate il codice noterete che i border dei th e td sono differenti.
Come risolvo?
Ultima modifica di TommyB1992 il martedì 16 maggio 2017, 15:47, modificato 1 volta in totale.
TommyB1992
Prode Principiante
 
Messaggi: 231
Iscrizione: luglio 2013
Desktop: GNU/Linux
Distribuzione: Ubuntu 15.04 (i686)
Sesso: Maschile

Re: [CSS] Stesso width di th e td di due tabelle differenti

Messaggioda Danny90 » martedì 16 maggio 2017, 9:12

Intendi che lo vorresti così?

Codice: Seleziona tutto
<!DOCTYPE html><html><head>
<style>
 * {
    margin: 0;
    padding: 0;
    font-family: "Segoe UI", Arial, sans-serif;
}
table{
  width:100%;

}
.tbl-header{
  background-color: #fff;
  background-color: #f5f5f6

 }
.tbl-content{
  height:300px;
  overflow-x:auto;
  margin-top: 0px;

}
th{   

  font-weight: bold;
  text-align: left;
  font-size: 12px;
  color: #949494;;
  text-transform: uppercase;
  width: 20px;
  padding:10px;
  border-right: 1px solid #ebebeb;
}
td{

  text-align: left;
  font-size: 12px;
  color: #fff;
  color: #949494;;
  border-bottom: 1px solid #ebebeb;
  border-right: 1px solid #ebebeb;
  width: 70px;
  padding:10px;
}
::-webkit-scrollbar {
    width: 6px;
}
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
</style>
</head><body>

  <div class="tbl-header">
    <table>
      <thead>
        <tr>
          <th>a</th>
          <th>b</th>
          <th>c</th>
          <th>d</th>
          <th>e</th>
        </tr>
      </thead>
    </table>
  </div>
  <div class="tbl-content">
    <table>
      <tbody>
        <tr>
          <td>dassd</td>
          <td>2123123 </td>
          <td>12231</td>
          <td>asdasdd</td>
          <td>sdaasd21323</td>
        </tr>
      </tbody>
    </table>
  </div>

</body></html>
Im schlechten Kleide wohnt oft auch Weisheit.
Avatar utente
Danny90
Prode Principiante
 
Messaggi: 133
Iscrizione: maggio 2015
Località: Dresden (Germany)
Desktop: KDE plasma 5
Distribuzione: Kubuntu 17.04
Sesso: Maschile

Re: [CSS] Stesso width di th e td di due tabelle differenti

Messaggioda UbuNuovo » martedì 16 maggio 2017, 12:06

Visto che usi la larghezza della tabella in percentuale, ti conviene impostare 'width: 20%;' sia in 'th' che in 'td'
Nel caso in cui sia il primo a rispondere ad una richiesta di aiuto...chiunque abbia una soluzione migliore o anche solo diversa dalla mia è incoraggiato ad intervenire liberamente senza inviarmi alcun messaggio privato. In programmazione è basilare sapere che si può ottenere il medesimo risultato utilizzando metodi diversi.
Avatar utente
UbuNuovo
Imperturbabile Insigne
Imperturbabile Insigne
 
Messaggi: 2834
Iscrizione: dicembre 2009
Desktop: Mate
Distribuzione: Ubuntu 14.04
Sesso: Maschile

Re: [Risolto] [CSS] Stesso width di th e td di due tabelle d

Messaggioda TommyB1992 » martedì 16 maggio 2017, 15:47

Grazie dell'aiuto a tutti e due
TommyB1992
Prode Principiante
 
Messaggi: 231
Iscrizione: luglio 2013
Desktop: GNU/Linux
Distribuzione: Ubuntu 15.04 (i686)
Sesso: Maschile


Torna a Programmazione

Chi c’è in linea

Visualizzano questa sezione: 0 utenti registrati e 9 ospiti