web-dev-qa-db-fra.com

bootstrap réduire le rembourrage des lignes

J'utilise Bootstrap 3.x avec une définition de table comme celle-ci

<table class="table table-hover table-condensed table-striped table-bordered">

Trucs assez standard

Je veux réduire le remplissage vertical par défaut des cellules - je souhaite réduire davantage le remplissage des cellules. Je sais que le condensé sur table réduit le rembourrage vertical de 50%. Je veux le réduire à 1px. 

Où est-ce que je fais le changement? J'ai essayé de passer par bootstrap.min.css mais je ne trouve rien à modifier, rien que je comprenne

Merci d'avance

Meilleurs vœux

Iyer

htmltwitter-bootstraptwitter-bootstrap-3
12
K Y Iyer

C'est assez facile si vous savez utiliser l'outil d'inspection de votre navigateur (Clic droit-> Inspecter l'élément). Si vous voulez apprendre le CSS, ce serait un outil très important.

Alors trouvez cette propriété:

.table-condensed>thead>tr>th, .table-condensed>tbody>tr>th, .table-condensed>tfoot>tr>th, .table-condensed>thead>tr>td, .table-condensed>tbody>tr>td, .table-condensed>tfoot>tr>td{
    padding: 5px;
}

qui a padding: 5px;, changez-le en 1px.

Voici à quoi il ressemble lorsqu’il est modifié.

22
I Can Has Kittenz

+1 "Inspecter l'élément" ... vous indique exactement quels sont les paramètres par élément et d'où ils viennent. Outil précieux pour travailler avec la mise en page.

En ce qui concerne la personnalisation de Bootstrap (au moins v3), je pense que Site.css est le fichier de remplacement local au niveau du site ... donc ne modifiez pas les fichiers css de démarrage de base ... votre dossier personnel. Si les modifications de style ne semblent pas prendre, ajoutez-leur la balise! Important. Et si vous mettez à jour votre package d'amorçage, veillez à enregistrer une copie de votre site.css afin de pouvoir réappliquer vos personnalisations.

0
John Kowtko

Remarque - Au lieu de modifier la classe .table-condensed qui contiendra toutes les tables qui utilisent cette classe bootstrap, il pourrait être plus avantageux de créer une autre classe (disons table_morecondens) comme ci-dessous ...

.table_morecondensed>thead>tr>th, 
.table_morecondensed>tbody>tr>th, 
.table_morecondensed>tfoot>tr>th, 
.table_morecondensed>thead>tr>td, 
.table_morecondensed>tbody>tr>td, 
.table_morecondensed>tfoot>tr>td{ padding: 2px; }
0
MarcoZen